Question

如果你已经看过这个，我道歉。我还在苦苦挣扎。我只需要修改函数，只从菜单上选择的链接加载colTwo div而不是整个页面。

我看到了jquery网站上的代码：

$('#result').load('ajax/test.html #container');

但我不明白如何让这个功能做到这一点。

<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>My Title</title>
<link href="default.css" rel="stylesheet" type="text/css" />
</head>

<script type="text/javascript" src ='jquery-1.9.1.min.js'></script>
<script type="text/javascript">


    $(function(){
        $('#menu li a').on('click', function(e){
            e.preventDefault();
            var page_url=$(this).prop('href');
            $('#colTwo').load(page_url);
        });
    });


</script>
<body>
<div id="header">
    <h1>My Title</h1>
</div>
<div id="content">

    <div id="colOne">

        <div id="menu1">
            <ul id="menu">
                <li><a href="members.html">Members</a></li>
                <li><a href="about.html">About</a></li>

            </ul>
        </div>
        <div class="margin-news">
            <h2>Recent Updates</h2>
            <p><strong>None At This Time</strong> </p>
        </div>
    </div>

    <div id="colTwo"><h2>Starting Text</h2></div>
    <div style="clear: both;">&nbsp;</div>
</div>

</body>
</html>

Answer 1

Kevin B是对的：

$('#colTwo').load(page_url + ' #colTwo');

只需将选择器作为字符串添加到URL中，不要忘记空格！

jquery load函数只获取div而不是整个页面

1 个答案: