AJAXify 网站

发布于 2024-07-26 10:23:22 字数 339 浏览 5 评论 0原文

我有正当理由去做我试图解释的事情。我有一个现有的网站，比如 abc.com，它有常规页面等，所有内容都是用 php 编写的。现在我想对网站进行 AJAX 化，即当用户单击链接时，它应该使用 AJAX 获取链接并替换页面内容。这是简单的部分，我可以使用 jQuery get 函数来实现它。

现在，当用户为页面添加书签时，问题就出现了。我可以使用哈希标签来指定用户是否在另一个页面上，但不是使用 javascript 再次获取新页面，而是可以在调用页面时直接使用 PHP 获取它。

您能给我一个如何实现上述目标的概要吗？此功能与 Facebook 的功能类似。

感谢您的时间。

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

陌伤浅笑 2024-08-02 10:23:22

这是一个相当简单的过程：(1) 解析哈希标签，(2) 像平常一样通过 Ajax 加载内容。

如果您在用户单击页面时加载更多内容，请确保始终正确修改哈希标签以反映页面上的内容。

这是一个简单的示例供您使用。单击名称并记下井号标签。相关的 JavaScript 看起来像这样：

// Go straight to content if it's in the hash.
$(document).ready(function(){
   load_story_from_hash();
});

// Call this function whenever user clicks on a hash link
function set_hash(hash){
   window.location.hash = hash;
   load_story_from_hash()
}

// Actually load content based on the hash in the URL
function load_story_from_hash(){

   var hash = window.location.hash;
   hash = hash.replace(/^#/, '');

   if (hash) {

      $('#post_container').load(hash+'.html', {}, function(){
         $.scrollTo('#post_container', 1000);
      });

   }

}

It's a fairly simply process of (1) Parsing the hash tag, and (2) Loading the content via Ajax as you normally would.

If you load more content when the user clicks on the page, just be sure to always correctly modify the hash tag to reflect what's on the page.

Here's a quick example to play around with. Click on a name and note the hash tag. The relevant Javascript looks like this :

// Go straight to content if it's in the hash.
$(document).ready(function(){
   load_story_from_hash();
});

// Call this function whenever user clicks on a hash link
function set_hash(hash){
   window.location.hash = hash;
   load_story_from_hash()
}

// Actually load content based on the hash in the URL
function load_story_from_hash(){

   var hash = window.location.hash;
   hash = hash.replace(/^#/, '');

   if (hash) {

      $('#post_container').load(hash+'.html', {}, function(){
         $.scrollTo('#post_container', 1000);
      });

   }

}

回复收藏 0 原文

她比我温柔 2024-08-02 10:23:22

答案是否定的，你无法获取URL哈希服务器端的值。请参阅如何从服务器端获取网址哈希 (#) 。

您必须在客户端获取哈希值并发出额外的请求。

回复收藏 0 原文

我是有多爱你 2024-08-02 10:23:22

jQuery History 是我的首选。可以在这里找到： http://www.balupton.com/projects/jquery-history / 提供跨浏览器支持，绑定到哈希值，重载哈希值，等等。

它还有一个名为 jQuery Ajaxy 的 Ajax 扩展，允许它轻松地将您的网页升级为适当的 Ajax 应用程序，而无需服务器端更改并保持 SEO 和 JS-Disabled 友好： balupton.com/projects/jquery-ajaxy/" rel="nofollow noreferrer">http://www.balupton.com/projects/jquery-ajaxy/

这是 http://wbhomes.com.au/ 和 http://www.balupton.com

总体而言，它们都有完善的文档、支持且功能丰富。他们还在这里赢得了赏金问题如何显示 Ajax 请求在网址中？