Question

我有一些像这样的导航：

<div class="nav">
    <ul>
        <li><a href="#">Home</a></li>
        <li><a href="#">About</a></li>
        <li><a href="#">Contact</a></li>
    </ul>
</div>

我希望当我点击链接时，该页面的内容将插入到对象中。我试过了

$('nav ul li a').click( function() {

    var obj={};

    $(this).nextAll('.content').insertAfter(obj);

});

换句话说，我试图在对象中缓存该内容以便稍后如果我想要做一些我想在对象中搜索的内容。我希望我的问题得到正确的解答：）

Answer 1

你确定你知道javascript对象究竟是什么吗？它们不能像这样插入DOM，调用obj = {}实际上也不会从任何地方加载任何东西。

据我所知，您正试图通过AJAX加载页面内容。如果是这种情况，我建议你看一下jQuery的.get()：

$('nav ul li a').click( function() {
    var location = $(this).attr("href"); // get the location of the link
    $.get(location, function(data){ // call AJAX to load the page content
         $("#content").html(data); // put page content into #content
    });
    return false; // make sure the link doesn't then follow through
});

Answer 2

您可以使用.data()存储内容，例如：

$('.nav ul li a').click(function (e) {

  var url = $(this).attr("href");
  $.get(url, function (content) {
    $(this).data('content', content);
  });

  // Prevent the anchor's default click action
  e.preventDefault();
});

查看内容如：

$('.nav ul li a').each(function () {

  // Open the console to view the content
  console.log($(this).data('content'));
});

在对象中插入内容

2 个答案: