如何通过单击菜单中的Li将HTML页面加载到DIV中?

如何通过单击菜单中的Li将HTML页面加载到DIV中?

问题描述:

我遇到了一个非常讨厌的问题。

i've came across a really annoying issue.

所以,我的计划是有一个UL菜单包含不同的安装量。
当我点击每一个我想加载一个新的HTML页面到我的Content-DIV。

So, my plan is to have a UL-menu containing different ammounts of Li inside of it. And when i click each of them i want to load a new HTML-page into my "Content-DIV".

我做了很多研究我发现了关于Ajax和Jquery。我试过这么多不同的代码,使其工作,我已经设法链接我的.js文件到我的索引文件成功。我尝试了一个simpel警报命令。
但是当我试图加载我的页面到我的DIV,它不工作,我不知道什么错误!
我在stackoverflow上找到一个链接,这几乎是一样的,他们没有使用菜单打开页面。

I've done alot of research and i found out about Ajax and Jquery. I've tried so many different codes to make it work, and i've managed to link my .js file to my index file sucessfully. I tried it out with a simpel Alert command. But then when i try to load my page into my DIV, it doesnt work at all, and i have no idea whats wrong! I found a link here on stackoverflow which were almost the same, tho they didnt use a menu to open up the pages.

这里是我的索引:

    <div id="Left">

    <ul id="nav" >

    <li><a href="Home.html id="load_home">Home</a></li>
    <li><a href="#">Page 1</a></li>
    <li><a href="#">Page 2</a>

    </ul>

</div>




$ b b


<script>$(document).ready( function() {
$("#load_home").on("click", function() {
    $("#content").load("Home.html");
}); });</script>

任何想法,任何答案都将非常感激。
谢谢。

Any ideas? Any answers would be much appreciated. Thank you.

/ Martin

您将尝试此代码

$(document).ready( function() {
    $.get('Home.html', function(data) {
        $("#content").html(data);
    });
});