2011-06-21 35 views
-1

我对AJAX颇为陌生,目前正在学习如何在演示网站上实现jQuery地址,以便将其移植到我正在开发的个人项目中。jQuery地址 - 深度链接和状态

尽管我可以通过超链接加载所需内容并修改URL哈希,但如果我直接在浏览器栏中输入URL哈希,我无法导航到特定状态。

当前的代码是这样的:

$("h2.entry-title a").live('click', function(event) { 
    event.preventDefault(); 
    $("#content").fadeOut("slow").load($(this).attr("href")+" #content > *", function() { 
     $.address.value("?page=entry"); 
    }).fadeIn("slow"); 
}); 

我试图寻找关于使用jQuery地址,实现深层链接教程和演示,但到目前为止,没有取得丰硕。

感谢您的帮助:)

P/S:为什么我用.live()代替.bind()是因为在某些时候更进入游戏将被动态插入的原因。

回答

0

当你第一次加载页面时,这段代码中没有任何内容会读取url。如果您输入地址栏'http://test.com/test.html?page=entry',则需要在加载页面时加载内容,手动更改散列和点击事件。

http://abishaigray.com/jquery.address.php

$(function() { 
    var content = $("#content"); 
    var loadUrl = function(url) { 
     content.fadeOut("slow", function() { 
      content.load(url + " #content > *", function() { 
        content.fadeIn("slow"); 
       }); 
     }); 
    }; 
    $("a.loadUrl").live('click', function(event) { 
     event.preventDefault(); 
     $.address.parameter("page", $(this).attr("href")); 
    }); 
    $.address.change(function(vars) { 
     var page = $.address.parameter("page"); 
     if (page) { loadUrl(page); } 
    }); 
}); 

我把$.address.change事件的优势。通过这种方式,无论何时您更新网址或用户第一次到达时,内容都会重新加载。

+0

我有一个想法,我必须在某个时候使用$ .address.change,但我不知道如何实现它。你有一个简单的例子来说明这一点吗?谢谢你:) – Terry

+0

当然,见下文。 '$ .address.change(function(vars){alert('url changed!');});' 此外,请仔细阅读[jQuery Adress Docs](http://www.asual.com)/jquery/address/docs /) –

+0

谢谢。我几天前通读了文档和示例,但仍然在努力了解它是如何工作的。我在这里举了一个例子来说明'$ .address.change()'是如何工作的 - http://jsfiddle.net/5L6Ur/9/ 不过,困扰我的是如何在用户导航到正确的状态时他们输入一个国家特定的网址?我希望有一些正则表达式,但到目前为止还没有发现任何示例。 – Terry