Question

<html>
<head>
<title></title>
<script type="text/Javascript" src="includes/scripts/jquery-1.7.2.min.js"></script>
<script type="text/Javascript">
$('a').click(function() {
  window.open($(this).attr('href') );
});
</script>
</head>
<body>
<div id="content">
<a href="somepage.html">Somepage</a>
<br />
<a href="somepage.html">Somepage</a>
<br />
<a href="somepage.html">Somepage</a>
<br />
<a href="somepage.html">Somepage</a>
<br />
<a href="somepage.html">Somepage</a>
</div>
</body>
</html>

我想用jQuery .load（）打开页面中找到的所有链接但是我的代码似乎不起作用有什么想法吗？

Answer 1

$(function () {
    $('a').each(function() {
      window.open($(this).attr('href') );
    });
});

click实际上是点击HTMLElement的动作。 each是通过它们的循环。

将所有内容包装在$();中告诉jQuery，

“嘿，直到一切准备就绪，你不会跑我。我想要所有的DOM 元素可寻址。“

这是$(document).ready [doc]的简写。

Answer 2

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

此代码将使用户点击页面上的链接而不是转到该页面时，该页面的内容将被加载到您的content div中。 e.preventDefault()会阻止链接的默认操作（离开页面）并让用户保持在您的页面上。

现在，问题在于，一旦您点击了一个链接，加载到div中的任何内容都不会应用此代码。您可以通过使用jquery的on（或旧的jquery版本中的委托）使用事件委派来解决这个问题。

$("#content").on("click", "a", function(e) {
    $("#content").load($(this).attr('href') );
    e.preventDefault();
});

此代码适用于#content中的所有链接，最初的链接以及稍后加载的链接。

用jQuery .load打开所有链接

2 个答案: