为非javascript创建一个#-tag javascript链接词
Make a #-tag javascript link word for non javascript
使用以下教程,我希望我的网站使用AJAX来加载内容(但也希望能够使用后退按钮等):http://www.queness.com/post/328/a-simple-ajax-driven-website-with-jqueryphp
当然,如果有人禁用了javascript,网站也应该工作(没有Ajax)。
然而,当启用javascript的用户向未启用javascript的用户发送链接时,问题就出现了。因为javascript是禁用的,它将不能正确处理#标签,只会转到主页(所以从javascript用户直接链接到非javascript用户的页面是不可能的)。是否有办法解决这个问题(最好是php或htaccess)。
HTML5为我们提供了无需刷新页面即可更改URL的方法https://developer.mozilla.org/en/DOM/Manipulating_the_browser_history#Adding_and_modifying_history_entries
这意味着你可以在不刷新页面的情况下更新一些东西,但仍然给用户一个url,他们可以收藏或发送给其他人。这些url可以在没有JavaScript的情况下工作,只要您在这些位置有页面或使用mod_rewrite或类似的方法捕获它们。
https://github.com/browserstate/history.js是一个很棒的小polyfill,如果浏览器支持它,它将使用HTML5历史内容,否则(Internet Explorer)它会改变url的哈希值。
基本上有三个步骤:
- 编码你的"a"标签正常:
<a href='about'>About us</a>
- 在你的javascript代码中,拦截
<a>
标签上的所有click
事件,并导航到#
+this.href
。所以当他们点击上面的url时,你导航到site.com/#about
而不是site.com/about
- 在你的javascript代码中,有一个计时器函数,读取当前位置的哈希值,并通过ajax加载相应的url(带有# removed)
既然你像往常一样编写你的html,网站仍然完全可以被非js用户访问,更重要的是,对于搜索引擎的机器人。
对于这些评论,我可以提出以下建议:
- 通过javascript将主页从
site.com
重定向到site.com/js/
- 当
<a href='about'>
被点击时,导航到site.com/js/#about
- 在"js"页面上,为非js用户设置
<a id=about href="/about">click here</a>
为什么不正常构建应用程序,然后在上面添加AJAX,而不是反过来,给自己带来更多的工作呢?
问问自己,为什么需要AJAX页面转换?你的应用程序真的需要标签吗,还是仅仅因为你在其他网站(比如Twitter)上看到了?
- Javascript:一个二维数组的字符串
- Javascript:一个变量包含值,但Firebug说它是空的
- 使用 JavaScript 一个接一个地播放几个音频
- Javascript 一个请求多个 JS 文件
- JavaScript:一个又一个循环不执行
- 动态加载头标签中的Javascript一个接一个完全加载后不追加,跨域
- Javascript:一个项目数组的sum-all-found.data()
- Javascript:一个带键的数组怎么可能呢
- JavaScript:一个变量可以有多个值吗
- Javascript-一个变量能在多大程度上保持其价值
- Javascript一个站点上有两个计算器
- JavaScript:一个接一个执行多个REST调用的正确方法
- JavaScript.一个奇怪的分配句子
- Javascript -一个函数中的多个任务无法工作
- javax.script传递给javascript一个Java方法作为回调
- Javascript -一个未知的JSON对象返回给我,我如何看待它
- JavaScript:一个字节应该是8位
- 当用户“看到”时激活JavaScript.一个元素
- Javascript一个输入字段连接到几个函数
- Javascript:一个IIFE函数以及供以后使用的函数定义