我使用的子菜单在master.html文件一个div显示来自外部HTML文件一个div。

I am using a submenu to display a div from an external html file in a div in the master.html file.

我已经经历了类似相关的东西，至少20例看，但不能为我的生活让我的code工作，遗憾的是虽然我知道为什么，我不知道如何解决这个问题。

I have looked through at least 20 examples of similar related things but cannot for the life of me get my code to work and unfortunately while I know why I don't know how to solve the problem.

所以，我在CSS定义的子菜单：

So I have a sub menu defined in css:

#subnav ul li#subone a:hover{color:#ffffff; background-color: #1e3435;}

我有master.html与HTML的子菜单

I Have master.html with the html for the submenu

<div id="subnav" >
    <ul>
        <li id="subone"><a href="#">About</a></li>
        <li id="subtwo"><a href="home.html">Home</a></li>

</div>

和我使用这个JavaScript code用的jquery.js包括在报头：

And I am using this javascript code with the jquery.js included in the header:

<script src="jquery.js"></script>
<script type="text/javascript">
$(function(){
    $(".subnav ul li a") .click(function(e){
        e.preventDefault()
        $('#content2').load( 'abc.html' );
    });
});
</script>

我知道什么是错在这里，但不能完全弄清楚，任何帮助将大大AP preciated。

I know something is wrong here but can't quite figure it out, any help would be greatly appreciated.

推荐答案

乍一看：

$(".subnav ul li a").click(...)

应

$("#subnav ul li a").click(...)

由于您使用＆LT; D​​IV ID =建议subnav＆GT; 。使用＃为 ID 和。类。

Because you have used <div id="subnav" >. Use # for id and . for class.

更新：从一个特定的元素加载内容，你可以使用这样的：

Update: To load content from a particular element you may use this:

$("#content2").load("abc.html  #container");

下面，的#container 是 ID 元素，仅此元素的HTML将被加载到目标 DIV ，所以一定要使用正确的标识符。了解更多关于 jQuery的网站。

Here, #container is the id of the element and only this element's html will be loaded into target div, so make sure you use the right identifier. Read more on jQuery website.

更新：：您可以使用一个功能/处理您的所有菜单项：

Update: You may use one function/handler for all of your menu items:

$(function(){
    $(".subnav ul li a") .click(function(e){
        e.preventDefault()
        $('#content2').load($(this).attr('href') + ' #content');
    });
});

请确保您所有的页/ HTML 文件包含同一个＃内容所以每次点击任意一个菜单项，相应的 HTML 文件将被加载到 $（'＃内容2'） DIV BT仅＃内容页面的一部分，也为所有菜单项适当的链接（的href =filename.html）。

Make sure your all pages/html file contains same #content so every time you click on any menu item, the appropriate html file would be loaded into $('#content2') div bt only #content part of the page and also provide proper link (href='filename.html') for all menu items.

如果您的所有网页都没有相同的 ID 为＃内容再加入数据目标='标识'中的每个 A 标签，就像这样：

If your all pages don't have the same id as #content then add a data-target='identifier' in each a tag, like this:

<div id="subnav" >
    <ul>
        <li><a href='abc.html' data-target='content'>Abc</a></li>
        <li><a href='def.html' data-target='someid'>Edf</a></li>
    </ul>
</div>

因此​​，在这种情况下，你可以使用这样的：

So in this case, you may use something like this:

$('#content2').load($(this).attr('href') + ' #' + $(this).attr('data-target'));