在jQuery中触发click时禁用单击处理程序

时间:2009-09-08 17:06:38

标签: javascript jquery

我们有一个用.NET和jQuery构建的网站。我们有自定义jQuery来在处理ASP.NET页面上调用load方法。在单击处理程序中触发了ajax调用,例如

$("#Submit").click(function(){
  $(a_selector).load("Process.aspx?data=" + someDataObject, null, function(){
    alert("Done")});
  }
  return false;
);

我们的问题是,当我们点击#Submit按钮时会触发点击,调用ajax来处理它。人们似乎双击了按钮,因此我们在双击中获得了多个数据库结果。有没有人知道如何防止这个问题?我考虑过通过JS禁用按钮,但我想知道其他想法。

3 个答案:

答案 0 :(得分:2)

使用jQuery的one function。这样,事件只被触发一次。当然,您还应该禁用该按钮,以便用户知道点击它是徒劳的。此外,显示微调器,进度条或更改光标样式以向用户指示正在发生的事情并且系统未卡住。

答案 1 :(得分:0)

$("#Submit").click(function(){
  $(a_selector).removeClass("class").load("Process.aspx?data=" + someDataObject, null, function(){
    $(this).addClass("class");
    alert("Done")});
  }
  return false;
);

然后添加一些特定的类,没有任何样式,您将用作选择器。不知道它是否会以你想要的方式工作,但它看起来对我来说是最简单的解决方案...... :)

答案 2 :(得分:0)

stop propagation

$("#Submit").click(function(event){
  event.stopPropagation();

  if (typeof $_submitSend == "undefined")
      var $_submitSend = true;
  else if ($_submitSend == true)
      return false;

  $_submitSend = true;

  $(this).attr("disabled", "disabled");

  $(a_selector).load("Process.aspx?data=" + someDataObject, null, function(){
    alert("Done")});
    $_submitSend = false;
    $(this).removeAttr("disabled");
  }
);