連續兩次單擊觸發鏈接時，如何防止click事件執行相同的查詢

Question

我有一個click事件，該事件在數據庫表上執行查詢，並且應該根據查詢返回的對象的長度觸發不同的警報。 該查詢檢查表以查看用戶是否已經存儲了與特定對象ID相關的用戶信息。 id代表一個事件。 我想防止用戶兩次為同一事件存儲他們的信息。 因此，當第一次單擊鏈接時，查詢將檢查表以查看是否已保存有關該事件ID的信息，如果尚未保存，則將其信息與事件ID一起存儲； 但是當第二次單擊該鏈接時，我想提醒一條消息，告訴用戶他們已經提交了他們的信息。 由於某種原因，當我對其進行測試時，條件條件第二次不起作用，這意味着當連續兩次單擊鏈接時，告訴用戶其已存儲其信息的消息不會發出警報。

$("#mainDiv").on('click', '.interested', function (event) {
    //get id attribute of the clicked "interested" link. It stores the id of the activity.
    var activityID = $(event.target).attr('id');

    /*instantiate object that will hold info about interested user. The constructor function and variables are declared in a different part of my code*/
    var intrstd = new interested(hood, gender, dateOfBirth, zip, uID);

    /*check the "Interested" table on Parse to see if the user already has info stored for this activity */
    var check = Parse.Object.extend("Interested");
    var interest = new Parse.Query(check);

    //these are query constrains that pick out the colum values I want. 
    interest.equalTo("parent", activityID);
    interest.equalTo("InterestedPPL", intrstd.uID);

    //interest.find() executes the query and "results" contains the return object
    interest.find({
        success: function (results) {
            /*if the user info is already saved for the specific id, show the alert, if not store the object containing their user info */
            if (results.length !== 0) {
                alert("you have already requested an invite to that activity");
            } else {
                var show = Parse.Object.extend("Interested");
                var int = new show();
                int.set("parent", activityID);
                int.set("InterestedPPL", intrstd);
                int.save();
                alert("you will be notified if you have been invited to this activity");
            } //closes else   
        },
        error: function (object, error) {
            // The object was not retrieved successfully.
            // error is a Parse.Error with an error code and description.
            console.log("Error: " + error.code + " " + error.message);
        }
    }); //closes find
}); //closes on

Answer 1

在事件處理程序外部聲明變量_clickFlag 。 如果_clickFlag為true，則處理事件。 在運行查詢之前，請將其設置為false，以便不處理連續的單擊。 在查詢成功回調中，再次將_clickFlag設置回true 。 該方法具有優勢。 它根本不會做額外的查詢。 希望我足夠清楚。 請參考下面的代碼示例。

var _clickFlag = true;
$("#mainDiv").on('click', '.interested', function(event){

    if (_clickFlag) {// Continue only if true

        _clickFlag = false; // this is to prevent other consecutive clicks to be processed when
        .
        .
        .

        interest.find({ success: function(results) {

            var show = Parse.Object.extend("Interested");
            var int = new show();
            int.set("parent", activityID);
            int.set("InterestedPPL", intrstd);
            int.save();

            _clickFlag = true;

            alert("you will be notified if you have been invited to this activity");
    .
    .
    .
    .