計算按鈕被點擊的次數而不使用全局變量

Question

有沒有一種方法可以告訴我使用jQuery點擊了多少次表單提交按鈕？

我發現了一些答案here但我不想使用全局變量。

有沒有一種方法來實現這一點，而不使用全局變量在jQuery中？

<form id="form"> 
    <input type="button" id="Submit" name="Submit" value="Submit" /> 
</form> 

的JavaScript：

var count = 0; 
$(document).ready(function(){ 
    $("form#Submit").submit(function(){ 
      count++; 
     }); 
}); 

只是舉例 - >我想允許用戶點擊按鈕的4倍，但如果他點擊超過4倍，我會表現出一定的警告消息

Answer 1

所以這是一個答案編輯幫你一起

$(document).ready(function() { 
    $("form#Submit").submit(function() { 
     var count = $(this).data("count") || 0; 
     if(count >= x) 
     { 
      //user clicked more than you wanted to so do something here 
     } 

     $(this).data("count", ++count); 
    }); 
}); 

Answer 2

你可以將計按鈕的data：

$(document).ready(function() { 
     $("form#Submit").submit(function() { 
      var count = $(this).data("count") || 0; 
      $(this).data("count", ++count); 
     }); 
    }); 

Answer 3

最初，爲您的按鈕添加一個id爲'clicked-0'。現在做如下：

$(document).ready(function(){ 
    $("form#Submit").submit(function(){ 
     var clicks = $(this).attr('id').replace('clicked-',''); 
     clicks = clicks+1; 
     alert("No. of times clicked:"+clicks); 
     $(this).attr('id','clicked-'+clicks); 
    }); 
}); 

Answer 4

$(document).ready(function(){ 
    var count = 0; 
    $("form#Submit").submit(function(){ 
     count++; 
     console.log(count); //for instance 
    }); 
}); 

計數在上domready中執行匿名函數定義。因此，僅僅是aonymous函數內部可用的（和ofcourse到裏面的一切，如提交功能）

編輯

您可以測試它不是在全球範圍內：

$(document).ready(function(){ 
    var count = 0; 
    $("form#Submit").submit(function(){ 
     count++; 
     console.log(count); //for instance 
     console.log(window.count); //undefined 
    }); 
}); 

Answer 5

的JavaScript

function CountOnFormSubmitEvent(form_id, _callback_) 
{ 
    var that = this, count = 0, callback = _callback_; 

    var form = document.getElementById(form_id); 
    if(form === null) { return null; } 

    var reset = function(){ 
     count = 0; 
    }; 

    form.addEventListener("submit", function(evt){ 
     callback(evt, ++count, reset); 
    }, false); 
} 

var counter = new CountOnFormSubmitEvent("myForm", function(event, count, reset_callback){ 
    event.preventDefault(); 
    if(count >= 4) 
    { 
     alert("Too many clicks !"); 
     reset_callback(); 
    } 
}); 

http://jsfiddle.net/3snmg7bt/

我希望它會幫助你;）