javascript - jQuery onClick works for first two clicks but stops after that

Question

I am attempting to use jQuery to load a specific div from a separate page on my server into a div on the current page. The code is located in my header and it works successfully for the first two clicks on the website but not after that.

The code I'm using is:

 <script type="text/Javascript">
$('a').click(function(e) {
$("#container").load($(this).attr('href') + " #wrapper");
e.preventDefault();
});
</script>

I realize the site is not complete or fully functional, but it can be tried at: dev.justapo.co right now by doing the below steps:

1. Click on one of the posts
2. Once the post loads, click the title in the header
3. Now click any link on the page - the jQuery is broken

Any help is much appreciated, am trying to learn jQuery and not sure what I'm doing wrong here.

Answer 1

问题是 $('a').click() 在代码执行时将事件处理程序附加到所有锚元素，而新创建的元素不会设置该处理程序。

您需要使用委托，如下所示：

$('body').on('click', 'a', handler_function);

请参阅.on()的文档。

Answer 2

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

Answer 3

尝试 -

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

更新

我只是看看你的网站。你可能需要做这样的事情 -

$('#primary a').click(function(){
   $("#container").load($(this).attr('href') + " #wrapper");
   return false;
});

您正面临问题，因为此 IDprimary和 ID 不能重复。你应该需要使用类。

Answer 4

嘿，你也可以试试这个代码

$('a').live("click",function(e) {
$("#container").load($(this).attr('href') + " #wrapper");
e.preventDefault();
});

希望对你有帮助