在jQuery Address插件加入书签的页面上自动加载div内的内容

时间:2013-06-02 04:21:24

标签: html5 jquery deep-linking jquery-address html5-history

我正在使用jquery.address插件在通过ajax加载内容时更新浏览器的地址栏。一切正常,除了我不知道如何自动将event.value或event.path加载到用于尝试访问像“domain.com/about-us”这样的书签页面时我用来加载内容的DIV ,在这种情况下,页面加载,但“约 - 我们”内容不会加载到DIV中。我错过了什么?这是我的代码:

JS:

function loadURL(url) {
    $("#content").fadeOut(600, function() {
        $(this).load(url).fadeIn(800);  
    });
}

$.address.init(function(event) {

    $.ajax({
        url: event.value,
        success: function(data){ $('#content').load(data); }
    });

}).change(function(event) {

    $('a').click(function(){
         loadURL($(this).attr('href'));
    });

});

HTML:

<div id="menu">
        <ul>
            <li id="menu_about"><a href="about-us.html" rel="address:/about-us">About Us</a></li>
            <li id="menu_contact"><a href="contact.html" rel="address:/contact">Contact</a></li>
        </ul>
</div>

<div class="wrapper">

    <div id="content">

    </div>

</div>

htaccess的:

<IfModule mod_rewrite.c>
  RewriteEngine on

  # Rewrite current-style URLs of the form 'index.html?url=x'.
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule ^(.*)$ index.html?url=$1 [L,QSA]
</IfModule>

谢谢!

1 个答案:

答案 0 :(得分:0)

$。address.externalChange(function(event))就是你要找的。它会在页面加载时捕获路径。