如何防止我的Ajax函数在点击时触发多次? [英] How can I prevent my Ajax function to fire multiple times on click?

问题描述

index.php

index.php

   <button class="cat" data-table="cat" >Cat</button>
   <div class="animals"></div>

script.js:

script.js:

$(document).on("click", ".cat", function (event) {
    alert("cat");
    var table = $(this).data('table');
    $.ajax({
        url: "update.php",
        data: {

            table: table,
        },
        type: "POST",
        success: function (data) {
            $(".animals").html(data);
        }
    })
});

    $(document).on("click", ".dog", function (event) {
        alert("dog");
    var table = $(this).data('table');
    $.ajax({
        url: "update.php",
        data: {

            table: table,
        },
        type: "POST",
        success: function (data) {
            $(".animals").html(data);
        }
    })
});

   $(document).on("click", ".bird", function (event) {
       alert("bird");
    var table = $(this).data('table');
    $.ajax({
        url: "update.php",
        data: {

            table: table,
        },
        type: "POST",
        success: function (data) {
            $(".animals").html(data);
        }
    })
});

update.php

update.php

if ($table == "cat") {
    echo "<button class='dog' data-table='dog'>Dog</button>";   
}
if ($table == "dog") {
    echo "<button class='dog' data-table='dog'>Dog</button><button class='bird' data-table='bird'>bird</button>";   
}

if ($table == "bird") {
   echo "nothing";  
}

通过单击动物按钮(例如鸟")，我希望警报框仅触发一次.但是，每当我点击一只动物时，警报框就会发出越来越多的声音.

By click on an animal button (for example "bird") I expect the alert box fire only once. But everytime I click on an animal the alert box is firing more and more times.

推荐答案

尝试这个..'Unbind'

Try this .. 'Unbind'

 $('#updateUser').unbind('click').click(function () { 

  //do here ..
  })

这篇关于如何防止我的Ajax函数在点击时触发多次?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！