jquery load()特定div无法正常工作

时间:2011-09-08 23:29:21

标签: javascript jquery html

以下是有问题的HTML部分以及与之相关的Javascript:

HTML优先:

<div id="menu">
<ul>
<li><a href="content.html#diviwant">click</a></li>
</ul>
</div>

Javascript:

$("#menu a").click(function(){
var link=encodeURI($(this).attr("href"));
$("#divtobeloadedwith").load(link);
return false;
});

content.html结构:

<div id="wrapper">
<div id="diviwant">stuff</div>
<div id="dividontwant">stuff</div>
</div>

点击链接后,它会加载所有内容,而只加载特定的div。

2 个答案:

答案 0 :(得分:2)

根本问题是你想要两件事:

  1. 在没有Javascript的情况下运行时,您希望使用链接content.html#diviwant,因为它会加载页面content.html,然后跳转到ID为diviwant的元素。< / p>

  2. 使用Javascript运行时,您希望将content.html #diviwant传递给jQuery的load()方法,因为它告诉jQuery只加载目标页面中标识为diviwant的片段

  3. 我可能会使用content.html#diviwant作为链接,正如你所知,然后在jQuery中解释它:

    $("#divtobeloadedwith").load(link.replace('#', ' #'));
    

    ...为load()添加必要的空间。

答案 1 :(得分:1)

您需要删除链接content.html#diviwanthref之间的空格。

<li><a href="content.html#diviwant">click</a></li>

您还需要确保存在“divtobeloaded”。

<div id="menu">
    <ul>
        <li><a href="content.html#diviwant">click</a></li>
    </ul>
</div>
<div id="divtobeloaded"></div>