jQuery 事件多次触发

Question

首先，我做了我的家庭作业，我已经搜索了 Google 并使用了 evt.stopPropagation(); 和 unbind 方法，但没有解决我的问题.. . .

这是我的案例:

想象一下，我有一个带有一些链接的左侧bdar，单击每个链接时，中间的col将由ajax重新加载，并使用如下代码:

<script>
$('.leftsidebar a').on('click', function(){
    var page = $(this).attr('class')
    $('#middleCol').load('loader.php?page='+ page);
});
</script>

因此，每次单击左侧栏上的一个标签时，中间的 col 都会加载该标签 class.php，这样就可以了。

现在，在我在中间栏加载的页面中，在页面末尾我有一些 JavaScript，例如，如果它通过 loader.php?page=test 加载test 页面我有一些新的 jQuery 行，例如:

<script>
$('#blah').on('click', function(){
    $.ajax({
        type: 'POST',
        url: 'server.php',
        success: function(response){
            //blah  
        }   
    }); 
});
</script>

现在的问题是，当我第一次通过点击左侧栏的标签加载测试页面时，它工作得很好，点击#blah时只有1个请求会发送到server.php，但是当我单击左侧栏中的另一个 a 时，然后返回到 test，现在如果我单击 blah ，ajax请求将发送两次到server.php，依此类推...，如果我再尝试一次，请求将发送3次!

如何防止此类行为？解决办法是什么？

我很感激帮助。

Answer 1

如果该元素绑定(bind)的点击处理程序不超过一个，您也可以这样做:

$('#blah').off('click').on('click', function(){...});

但最好不要包含无用/冗余的代码