Javascript 将html加载到div、menu、switch中

我需要完成javascript，以便将html页面加载到div中。我希望将page1、page2等加载到div id=“content”中。如果有人帮助我，我将不胜感激。谢谢

HTML

JAVASCRIPT

$(document).ready(function(){
$('nav ul li a').click(function(){
   $('nav ul li a').removeClass('active');
   $(this).addClass('active');
});    



});

使用

。。。我们应该做到这一点

注意——不起作用，因为它不太支持AJAX内容。

---

第二个注意事项-是这个的一个更简单的版本。使用该选项。：）

假设您的

href

引用了包含要显示的内容的文件，您可以使用。您可以使用获取

href

属性

防止在单击锚时执行默认操作（重定向到新页面）

您可能还希望在页面加载时为

.active

nav按钮触发此功能。出于这个原因，我添加了一个过滤器和一个点击触发器

$(document).ready(function () {
    var $navAnchors = $('nav ul li a');
    $navAnchors.click(function (e) {
        var $this = $(this);
        e.preventDefault();
        $navAnchors.removeClass('active');
        $this.addClass('active');
        $('#content').load($this.prop('href'));
    }).filter('.active').click();
});

注意，我已将匹配的jQuery集合指定给一个变量，以避免重复选择。这样，在DOM加载时只搜索一次

nav ul li a

$(document).ready(function(){
$('nav ul li a').click(function(){
   $('nav ul li a').removeClass('active');
   $(this).addClass('active');
});    



});

$(document).ready(function(){
    $('nav ul li a').click(function(e){          // when a nav link ('a' tag) is clicked...
        $('nav ul li a').removeClass('active');  // remove the css class "active" from any nav links.
        $(this).addClass('active');              // add the css class "active" to the one we clicked

        e.preventDefault(); // <-- important!    // prevent the page from navigating away
        var page = this.href;                    // get the url the link would normally go to
        $.get( page, function( data ) {          // in the background, get the content of the page for the link we have clicked
          $( "#content" ).html( data );          // load the content we have into the element with id "content"
        });
    });       
});

$('nav ul li a.active').click();                  // Get the nav link which has class "active", and fire the click() event.

$(document).ready(function () {
    var $navAnchors = $('nav ul li a');
    $navAnchors.click(function (e) {
        var $this = $(this);
        e.preventDefault();
        $navAnchors.removeClass('active');
        $this.addClass('active');
        $('#content').load($this.prop('href'));
    }).filter('.active').click();
});