本当ã¯ãã‚Œãªã‚Šã«é¢å€’ãã•ã„JavaScriptã¨historyã¨Ajaxã®ãŠè©± - æ„›ã¨å‹‡æ°—ã¨ç¼¶ãƒ“ール
å£ä¸Š historyã¨Ajaxã¨ã„ãˆã°ã€JavaScriptã‹ã‚‰ã‚る程度任æ„ã§historyã®ã‚¨ãƒ³ãƒˆãƒªã‚’pushã§ãã‚‹history.pushStateã¨ã‹ã€history.replaceStateã¯æ—¢ã«å¤§åˆ†æœ‰åã«ãªã£ãŸæ„ŸãŒã‚る。 ç´ æ™´ã‚‰ã—ã„未æ¥ã§ã¯ã€å…¨ã¦ã®ãƒ–ラウザã«pushStateãŒä¹—ã£ã¦ã„ã¦ã€Œlocation.hashを使ã£ãŸAjaxé·ç§»ãŒè¨±ã•ã‚Œã‚‹ã®ã¯10å¹´å‰ã®ãƒ–ラウザã¾ã§ã よãーã€ã¨ã„ã†ãƒãƒƒãƒ”ーãªä¸–ç•ŒãŒå®Ÿç¾ã™ã‚‹ã®ã ã‚ã†ã€‚ãŒã€ä»Šç¾åœ¨ã§ã¯ã¾ã pushStateã«å¯¾å¿œã—ã¦ã„ãªã„ブラウザã®ã‚·ã‚§ã‚¢ã‚‚多ãã€Ajaxã«ã‚ˆã‚‹æ“¬ä¼¼ç”»é¢é·ç§»ã‚’モリモリ行ã†ã‚ˆã†ãªã‚µã‚¤ãƒˆã§ã¯pushStateã®ã‚る環境ã€ãªã„環境ã®ä¸¡æ–¹ã‚’考慮ã—ã¦ã‚„ã‚‹å¿…è¦ãŒã‚る。 (ã¡ãªã¿ã«ã€è¦ä»¶ã«ã‚ˆã£ã¦ã¯ã€ŒpushStateãŒãªã„ブラウザã¯é€šå¸¸ã®é·ç§»ã§æˆ‘æ…¢ã—ã‚ï¼ã€ã¨ã„ã†å‰²ã‚Šåˆ‡ã‚Šã‚‚全然ã‚ã‚Šã ã¨æ€ã†) å…ˆã«è¨€ã£ã¦ãŠãã¨ã€ã“ã®è¨˜äº‹ã¯é•·ã„ã§ã™ã€‚ ç’°
Android4.0ã«ã¯HTML5 History APIãŒå®Ÿè£…ã•ã‚Œã¦ã„ãªã„ - æ„›ã¨å‹‡æ°—ã¨ç¼¶ãƒ“ール
（※ã“ã®ã‚¨ãƒ³ãƒˆãƒªãƒ¼ã¯ã€ã€ŒAndroidã®ãƒ–ラウザã¯æœ¬å½“ã®ã‚¯ã‚½Advent Calendarã€ã®ä¸€æ—¥ç›®ã®è¨˜äº‹ã¨ã—ã¦æ›¸ã„ã¦ã„ã¾ã™ï¼‰ 12/2ã«ç™ºå£²äºˆå®šã®Galaxy Nexusã«ã‚‚æ載ã•ã‚Œã‚‹äºˆå®šã®Android4.0ã§ã™ãŒã€ãªã‚“ã¨æ¨™æº–ブラウザã«HTML5 history APIãŒã€Œå®Ÿè£…ã•ã‚Œã¦ã„ã¾ã›ã‚“ã€ã€‚ 2.2ç³»ã€2.3ç³»ã«ã¯ã‚ã£ãŸã®ã«ã€ãªãœã‹ãªããªã£ã¦ã„ã¾ã™ã€‚ http://caniuse.com/#search=pushState ã“ã“ã«æ›¸ã„ã¦ã‚る通りã€å®Ÿéš›ã«Android4.0ã®emulatorã§History APIãŒã€Œãªã„ã€ã“ã¨ãŒç¢ºèªã•ã‚Œã¦ã„ã¾ã™ã€‚4.0ã¯ã‚¹ãƒžãƒ¼ãƒˆãƒ•ã‚©ãƒ³å‘ã‘ã®2ç³»ã¨ã‚¿ãƒ–レットå‘ã‘ã®3ç³»ã®åˆæµã€ã¨ã„ã†ç«‹ã¡ä½ç½®ã‚‰ã—ã„ã§ã™ãŒã€ãƒ–ラウザã«é–¢ã—ã¦ã¯History APIã®ãªã„3ç³»ã«å¯„ã£ã¦ã—ã¾ã£ã¦ã„ã‚‹ã®ã§ã—ょã†ã‹â€¦ã€‚ 「ãŠå‰ã®å¥½ããªAPIãŒãªããªã£ãŸãらã„ã§é¨’ããªã‚ˆã€ã¨ã„ã†äººã‚‚ã„
Firefox 4 ã§ã® History API ã®å¤‰æ›´
補足: ã“ã®è¨˜äº‹ã§ã¯ HTML5 ã® History API ã®ä»•æ§˜ã«å•é¡ŒãŒã‚ã‚Šã€Firefox 4 ã§ã¯æ”¹å–„ã•ã‚ŒãŸ API ã‚’æ案・実装ã—ãŸäº‹ãŒæ›¸ã‹ã‚Œã¦ã„ã¾ã™ã€‚ã“ã‚Œã ã‘èªã‚€ã¨äº’æ›æ€§ãŒå¿ƒé…ã«ãªã‚‹ã‹ã¨æ€ã„ã¾ã™ãŒã€ã“ã®æ案ã¯ã™ãã«ä»–ã®ãƒ–ラウザベンダーã‹ã‚‰ã‚‚è³›åŒãŒå¾—られã€ä»•æ§˜ ã«ã‚‚ä»–ã®ãƒ–ラウザã®å®Ÿè£…ã«ã‚‚åæ˜ ã•ã‚Œã¦ã„ã¾ã™ã€‚より詳ã—ã㯠WHATWG ML ã§ã®è°è«–ãªã©ã‚’ã”覧ãã ã•ã„。 原文: History API changes in Firefox 4 (公開: 2011-03-02) ã“ã®è¨˜äº‹ã¯ Gecko 開発者 Jonas Sicking ã«ã‚ˆã‚‹ã‚²ã‚¹ãƒˆæŠ•ç¨¿ã§ã™ã€‚ ã‚‚ã†ã”å˜çŸ¥ã§ã—ょã†ãŒã€ç§ãŸã¡ã¯ Firefox 4 ã®ãƒªãƒªãƒ¼ã‚¹ç›´å‰ã¨ã„ã†æ®µéšŽã«æ¥ã¦ã„ã¾ã™ã€‚Firefox 4 ã§ã¯ HTML5 ã® History API (pushState(), replaceState() ãªã©ã‚’定義)
YappoLogs: jQuery Mobile ã® permalink ã‚’ HTML5 使ã£ã¦ location.hash ã˜ã‚ƒãªãã™ã‚‹ jquery.mobile.useHistoryState.js を書ã„ãŸ
jQuery Mobile ã® permalink ã‚’ HTML5 使ã£ã¦ location.hash ã˜ã‚ƒãªãã™ã‚‹ jquery.mobile.useHistoryState.js を書ã„㟠ã“ã‚“ jQuery Mobile使ã£ã¦ã¾ã™ã‹ï¼1月ã«ãƒªãƒªãƒ¼ã‚¹ã•ã‚Œã‚‹ã£ã¦å™‚èžã„ã¦ã‚‹ã‚“ã§ã™ãŒã¾ã é ‘å¼µã£ã¦ã‚‹ã¿ãŸã„ã§ã™ãï¼ jQuery Mobile ã§ã¯ <A href="#foo"> ã®ã‚ˆã†ãªãƒªãƒ³ã‚¯ã‚’クリックã™ã‚‹ã¨ <div data-role="page" id="foo"> ã§å›²ã¾ã‚ŒãŸè¦ç´ を表示ã—ã¦ã€ http://example.an/oreno/index#foo ã¨ã„ㆠURL ãŒãƒã‚±ãƒ¼ã‚·ãƒ§ãƒ³ãƒãƒ¼ã«å…¥ã‚Šã¾ã™ã€‚ 時ã¨ã—ã¦PCã¨é ˆç£¨è£œã¯åŒã˜URLを使ã„ãŸã„ã¨ã„ã†è¦æ±‚ã‚‚ã‚ã‚‹ã§ã—ょã†ã€‚ãã†ã„ã£ãŸå ´åˆã« jQuery Mobile ã§å¯¾å¿œã™ã‚‹ã«ã¯ã€ãã‚Œãžã‚Œã® URI ã§ãƒšãƒ¼ã‚¸ã‚’生æˆã—ã¦ã‚ã’㦠hre
githubã®ã‚¢ãƒ¬(history.replaceStateã¨ã‹history.pushStateã®è©±) - æ„›ã¨å‹‡æ°—ã¨ç¼¶ãƒ“ール
会社ã§ä¸‹ã®è¨˜äº‹ã«ã¤ã„ã¦ãƒªãƒžã‚¤ãƒ³ãƒ‰ã—ã¦ã‚‚らã£ã¦ã€ãªã‚“ã¨ãªãæ°—ã«ãªã£ã¦ã„ãŸã“ã¨ã‚’調ã¹ãŸãƒ¡ãƒ¢ã€‚ http://webtech-walker.com/archive/2010/12/06160539.html 記事をèªã‚“ã§ã€history.replaceState(null, "title", "/new.html") ã¨ã‹ã‚„ã‚‹ã¨é·ç§»ãªã—ã§ãƒšãƒ¼ã‚¸ã®contentã‚‚å‹æ‰‹ã«ç½®ãæ›ã‚ã‚‹ã®ã‹ãªãƒ¼ã€ã ã£ãŸã‚‰ã‚ã®ã‚¢ãƒ‹ãƒ¡ãƒ¼ã‚·ãƒ§ãƒ³ã¯ã©ã“ã§ç™ºç«ã—ã¦ã‚“ã ？ã¨ã‹è€ƒãˆã¦ã„ãŸãŒãã‚‚ãã‚‚replaceStateã®å‹•ä½œã«ã¤ã„ã¦å‹˜é•ã„ã—ã¦ã„ãŸã€‚ è¦ã¯ã€æ¬¡ã®ã‚ˆã†ãªhtml書ã„ã¦ãƒœã‚¿ãƒ³ã‚’クリックã—ã¦ã‚‚ã€historyã®å…ˆé ãŒç½®ãæ›ã‚ã‚‹ã ã‘ã§ãƒšãƒ¼ã‚¸è‡ªä½“ã«ã¯ä½•ã‚‚èµ·ã“らãªã„。(ãŸã ã—location.hrefã¯ç½®ãæ›ã‚ã£ã¦ãŠã‚Šã€reloadã™ã‚‹ã¨/replace.htmlã«ã„ã) <!DOCTYPE HTML> <html lang="e
ã¯ã¦ãªã‚°ãƒ«ãƒ¼ãƒ—ã®çµ‚了日を2020å¹´1月31æ—¥(金)ã«æ±ºå®šã—ã¾ã—㟠- ã¯ã¦ãªã®å‘ŠçŸ¥
ã¯ã¦ãªã‚°ãƒ«ãƒ¼ãƒ—ã®çµ‚了日を2020å¹´1月31æ—¥(金)ã«æ±ºå®šã—ã¾ã—㟠以下ã®ã‚¨ãƒ³ãƒˆãƒªã®é€šã‚Šã€ä»Šå¹´æœ«ã‚’目処ã«ã¯ã¦ãªã‚°ãƒ«ãƒ¼ãƒ—を終了予定ã§ã‚る旨をãŠçŸ¥ã‚‰ã›ã—ã¦ãŠã‚Šã¾ã—ãŸã€‚ 2019年末を目処ã«ã€ã¯ã¦ãªã‚°ãƒ«ãƒ¼ãƒ—ã®æ供を終了ã™ã‚‹äºˆå®šã§ã™ - ã¯ã¦ãªã‚°ãƒ«ãƒ¼ãƒ—日記 ã“ã®ãŸã³ã€æ£å¼ã«çµ‚了日を決定ã„ãŸã—ã¾ã—ãŸã®ã§ã€ä»¥ä¸‹ã®é€šã‚Šã”確èªãã ã•ã„。 終了日: 2020å¹´1月31æ—¥(金) エクスãƒãƒ¼ãƒˆå¸Œæœ›ç”³è«‹æœŸé™:2020å¹´1月31æ—¥(金) 終了日以é™ã¯ã€ã¯ã¦ãªã‚°ãƒ«ãƒ¼ãƒ—ã®é–²è¦§ãŠã‚ˆã³æŠ•ç¨¿ã¯è¡Œãˆã¾ã›ã‚“。日記ã®ã‚¨ã‚¯ã‚¹ãƒãƒ¼ãƒˆãŒå¿…è¦ãªæ–¹ã¯ä»¥ä¸‹ã®è¨˜äº‹ã«ã—ãŸãŒã£ã¦æ‰‹ç¶šãã‚’ã—ã¦ãã ã•ã„。 ã¯ã¦ãªã‚°ãƒ«ãƒ¼ãƒ—ã«æŠ•ç¨¿ã•ã‚ŒãŸæ—¥è¨˜ãƒ‡ãƒ¼ã‚¿ã®ã‚¨ã‚¯ã‚¹ãƒãƒ¼ãƒˆã«ã¤ã„㦠- ã¯ã¦ãªã‚°ãƒ«ãƒ¼ãƒ—日記 ã”利用ã®ã¿ãªã•ã¾ã«ã¯ã”迷惑をãŠã‹ã‘ã„ãŸã—ã¾ã™ãŒã€ã©ã†ãžã‚ˆã‚ã—ããŠé¡˜ã„ã„ãŸã—ã¾ã™ã€‚ 2020-06-25 追記 ã¯ã¦ãªã‚°ãƒ«ãƒ¼ãƒ—日記ã®ã‚¨ã‚¯ã‚¹ãƒãƒ¼ãƒˆãƒ‡ãƒ¼ã‚¿ã¯2020å¹´2月28
history.pushStateã€history.replaceState - ç´ äººãŒãƒ—ãƒã‚°ãƒ©ãƒŸãƒ³ã‚°ã‚’勉強ã—ã¦ã„ãŸãƒ–ãƒã‚°
HTML5ã®history.pushStateã€history.replaceStateを試ã—ãŸã€‚ HTML5 pushState/replaceState demoã§å‹•ã‹ã›ã‚‹ã€‚ Minefieldã ã¨å®Œå…¨ã«æ„図ã—ãŸé€šã‚Šã«å‹•ããŒWebKitã ã¨URLã¾ã‚ã‚ŠãŒã†ã¾ãã„ã‹ãªã„。 メインã®ã‚½ãƒ¼ã‚¹ã‚³ãƒ¼ãƒ‰ã¯ä¸‹è¨˜ã®é€šã‚Šã€‚ canvasã§é©å½“ã«å£ç´™ç”¨ç”»åƒã‚’作るデモã§ã€ç”»åƒè‡ªä½“をクリックã—ã¦ä½•åº¦ã‚‚作り直ã›ã‚‹ã‚ˆã†ã«ã—ãŸã€‚ ã“ã†ã„ã†ç‰©ã‚’作るã¨ãã¯ã€å‰ã®ç”»åƒã«æˆ»ã‚Œã‚‹ã‚ˆã†å±¥æ´ç®¡ç†ã‚’ã™ã¹ãã ãŒã€ä»Šã¾ã§ã¯location.hashを使ã£ãŸã‚Šï¼ˆhashchangeイベントãŒå…¥ã‚‹ã¾ã§ã¯ã‚¿ã‚¤ãƒžãƒ¼ãŒå¿…è¦ã ã£ãŸï¼‰iframeを使ã£ãŸãƒãƒƒã‚¯ã ã£ãŸã‚Šï¼ˆãƒ–ラウザ間ã®äº’æ›æ€§ã‚„history.go(-2)ã‚’ãã¡ã‚“ã¨å‹•ã‹ã™ã®ãŒé›£ã—ã„）ã€ã‚ã‚‹ã„ã¯ãƒšãƒ¼ã‚¸ã‚’é·ç§»ã™ã‚‹ï¼ˆå¿…è¦ãªã„部分ã¾ã§æ¯Žå›žèªã¿è¾¼ã¾ã‚Œã‚‹ï¼‰å¿…è¦ãŒã‚ã£ãŸã€‚ pushState/repl
1
リリースã€éšœå®³æƒ…å ±ãªã©ã®ã‚µãƒ¼ãƒ“スã®ãŠçŸ¥ã‚‰ã›
最新ã®äººæ°—エントリーã®é…ä¿¡
j次ã®ãƒ–ックマーク
kå‰ã®ãƒ–ックマーク
lã‚ã¨ã§èªã‚€
eコメント一覧を開ã
oページを開ã
History APIã®æœ¬å½“ã®æã‚ã—ã•ã‚’æ•™ãˆã¦ã‚„ã‚‹
{{#tags}}- {{label}}
{{/tags}}