jquery - 无法让 jQuery .load 将内容加载到 div 中

Question

我有一个这样的列表:

<ul id="yearMenu">
  <li>Select a year</li>
  <li><a href="AJAX/2010PR.html">2010</a> |</li>
  <li><a href="AJAX/2009PR.html">2009</a> |</li>
  <li><a href="AJAX/2008PR.html">2008</a> |</li>
  <li><a href="AJAX/2007PR.html">2007</a> |</li>
  <li><a href="AJAX/2006PR.html">2006</a> |</li>
  <li><a href="AJAX/2005PR.html">2005</a></li>
</ul>

在另一个容器的下面是这个 div:

<div id="tableContent" class="tabWrapp"></div>

以及以下加载函数:

$("#ul#yearMenu li a").click(function() {
  var $parent = $(this).parent();
  $parent.addClass("selected").siblings().removeClass("selected");
  var href = $(this).attr('href');
  $("#tableContent").load(href + " #tableContent ", function() {
    //need to do something here?
  });
});

但所有链接都会在另一个页面中打开。我需要做什么才能将其加载到 #tableContent div 中？

Answer 1

尝试添加

return false;

到“点击”处理程序的末尾。如果没有这个，每个 <a> 的默认操作标签将被占用。

打电话 .preventDefault() 会更好(有些人会说更安全)在事件对象上:

$('#whatever').click(function(evt) {
  // ...
  evt.preventDefault();
});

这将允许事件冒泡，但阻止 <a>默认操作。