如何从未指定的html中加载片段？

Question

使菜单消失后，我无法让我的内容显示，但未列出特定的html。

这里是HTML：

<div id="header"> 
<h1>N300 Project Gallery</h1> 
</div> 
<div id="container"> 
<div id="utility"> 
<ul> 
    <li><a href="about.html">About</a></li> 
    <li><a href="projects.html">Projects</a></li> 

</ul> 

</div> 
    <div id="index-content">?</div> 
    <div id="footer">This is the footer</div> 
</div> 

这里是我的脚本：

$(document).ready(function() { 

    $('#utility a').click(function(e){ 
     e.preventDefault(); 
     $('#utility').hide('normal',loadContent); 
    }); 
    function loadContent() { 
     $('#index-content').load(url+ '#content') 
    } 
}); 

这里是片段我想移动：

<div id="content"> 
    <p>Hello! My name is Brittany Shephard.</p> 
</div> 

Answer 1

注意，如果你想在fragment loading behavior（+ ' #content'而不是+ '#content'），你需要在你传递给​​网址#content前一个额外的空间。

您的片段位于单独的文件中，是否正确？

假设您的片段从projects.html #content返回，请尝试：

function loadContent() { 
    $('#index-content').load($(this).attr('href')+ ' #content'); 
} 

从JQuery docs for hide，this被设置为回调隐藏的DOM节点。我假设你想从你隐藏的锚点加载URL，所以你需要从该节点获取href属性。

Answer 2

哪里是在loadContent()的url来自（哪里 ？

如果您需要将其从e.target href属性中传递出来，请为hide的回调以及将url传递给loadContent创建一个匿名函数。 Somtehing像：

$(document).ready(function() { 

    $('#utility a').click(function(e){ 
     e.preventDefault(); 
     $('#utility').hide('normal', function() { 
      loadContent($(e.target).attr('href')); 
     }); 
    }); 

    function loadContent(url) { 
     $('#index-content').load(url + ' #content'); 
    } 
});