一个()不使用AJAX?

jas*_*328 9 ajax jquery

我的页面上有三个div框.在每个div框中都有一个删除按钮,我按下该代码将删除div框.同一事件中的ajax请求根据向服务器按下div框发送唯一编号.为了防止在删除按钮上调用多个单击事件,我使用了one()事件.但在罕见的事件中,我快速单击按钮,它将触发事件两次,我看到数据库收到重复的数字.我以为one()可以防止这种情况发生.我的jquery代码导致它两次触发可能有什么问题?我的代码如下.

来自HTML的示例按钮

<input id="delete_post_3" type="button" value="X">
Run Code Online (Sandbox Code Playgroud)

jQuery代码

$('#delete_post_1').one('click', function() {
    var session_user_id = <? php echo $session_user_id; ?> ;
    var number = 1;
    $.post('ajax_delete_post.php', {
        user_id: session_user_id,
        number: number
    }, function() {
        $('#post_1').remove();
    });
});

$('#delete_post_2').one('click', function() {
    var session_user_id = <? php echo $session_user_id; ?> ;
    var number = 2;
    $.post('ajax_delete_post.php', {
        user_id: session_user_id,
        number: number
    }, function() {
        $('#post_2').remove();
    });
});

$('#delete_post_3').one('click', function() {
    var session_user_id = <? php echo $session_user_id; ?> ;
    var number = 3;
    $.post('ajax_delete_post.php', {
        user_id: session_user_id,
        number: number
    }, function() {
        $('#post_3').remove();
    });
});
Run Code Online (Sandbox Code Playgroud)

更新:根据请求,我将简要介绍整个页面的代码.

<script>

//when document is ready, loads jquery code that allows any div boxes that currently   
//exist on the page to have a click event that will delete the box. this is the same 
//code seen above in my example.

</script>

<form>
//form to fill out info
</form>

<script>
//ajax post sent when form button clicked
$.post('ajax_file.php', {data: data}, function(data){

//in here div box is created

<script>

//duplicated jquery code from top of page. without it the div box delete button does 
//not work

</script>

});

</script>
Run Code Online (Sandbox Code Playgroud)

Nop*_*ope 3

我无法判断这个问题是否已解决,但考虑到评论中的所有反馈,您似乎绑定了one两次,而且根据您在user23875答案中留下的评论,您似乎也知道这一点。

如果您绑定事件两次,它就会执行两次,就这么简单。

如果您完全意识到您绑定了事件两次,为什么不首先尝试取消绑定任何先前附加的事件。

$('#delete_post_1').off('click').one('click', function() {
...
$('#delete_post_2').off('click').one('click', function() {
...
$('#delete_post_3').off('click').one('click', function() {
Run Code Online (Sandbox Code Playgroud)

除非您还重新渲染完整的 HTML 两次,否则上述方法将确保您只附加了一次单击事件。

正如user23875所指出的,您肯定在脚本中做了一些时髦的事情。

您应该尽可能地分离代码,以确保您只想运行的代码只会被调用,依此类推。

希望以上内容能够解决这个问题。