多次点击相同的按钮获取相同的值多次在表格

问题描述：

我创建一个表格，基本上是从数据库中获取数据。但我的问题是，当我连续点击两次相同的按钮，然后我得到的数据两次我怎么可以在这里解决它下面是我的代码多次点击相同的按钮获取相同的值多次在表格

感谢

$(document).ready(function(){ 
 
    $("#clickBalanceLeave").click(function() { 
 
     $("#dropDownLeaveStatus").removeAttr("style").hide(); 
 
     $("#pendingRequest").removeAttr("style").hide(); 
 
     $("#requestHestroy").removeAttr("style").hide(); 
 
     $("#dynamicTable").empty(); 
 
     var ClientDetailId1 = localStorage.getItem("ClientDetailId"); 
 
     var ClientLoginId1 = localStorage.getItem("ClientLoginId") 
 
     var dataString = "{ 'ClientDetailId' : '" + ClientDetailId1 + "','ClientLoginId' : '" + ClientLoginId1 + "'}"; 
 
     $.ajax({ 
 
      type: "POST", 
 
      contentType: "application/json; charset=utf-8", 
 
      url: "/GetBalancebyUser", 
 
      corssDomain: true, 
 
      data: dataString, 
 
      dataType: "json", 
 
      success: function (data) { 
 
       var jdata = $.parseJSON(data.d); 
 
       var tableelement = $("#dynamicTable"); 
 
       var headertr = $("<tr><th>Unused Leaves </th><th>Used Leaves</th><th>Leave Type</th><th>Carry Forwarded</th><th>Leaves Allowed</th></tr>"); 
 
       tableelement.append(headertr); 
 
       if (jdata != null) { 
 
        for (var i = 0; i < jdata.length; i++) { 
 
         var trElement = "<tr>"; 
 
         trElement += "<td>" + jdata[i].UnusedLeaves + "</td>"; 
 
         trElement += "<td>" + jdata[i].LeavesTaken + "</td>"; 
 
         trElement += "<td>" + jdata[i].LeaveTypeName + "</td>"; 
 
         trElement += "<td>" + jdata[i].CarryForwardFromLastYear + "</td>"; 
 
         trElement += "<td>" + jdata[i].LeavesForThisYear + "</td></tr>"; 
 
         tableelement.append(trElement); 
 
        } 
 
       } 
 
       else if (jdata == null) { 
 
        tableelement.append('<tr><td colspan=6 style="color:red;text-align:center ">No Record found</td></tr>'); 
 
        //alert("No Data Found"); 
 
       } 
 
      } 
 
     }); 
 
    }); 
 
});

<a href="#" id="clickBalanceLeave" style="padding: 8px;">Balance Leave </a> 
 
<table id="dynamicTable"> 
 
</table>

究竟是什么问题？你能澄清一点吗？ – zola

答

我会考虑这个

$(document).ready(function(){ 
    var clicked = false; 
    $("#clickBalanceLeave").click(function (e) { 
    e.preventDefault(); // you are overloading a link. Stop the href 

    if (clicked) { 
     return; 
    } 
    clicked = true; 
    ... 
    $.ajax({ 
     type: "POST", 
     success: function (data) { 
     clicked = false;

您可以替换

$("#clickBalanceLeave").hide(); // where true 

$("#clickBalanceLeave").show(); // where false

的点击。如果您只想一次加载它，不要设置单击以虚假再次

我个人不喜欢用这样的全球旗帜。当你开始有很多这些时，它会变得混乱。隐藏/显示html链接元素的策略是足够的，也是一个很好的策略。 – TchiYuan

谢谢先生...它正在工作... –

答

你需要找到一个策略，不允许多次点击。

例如，一个策略是禁用按钮一旦被点击，这样当用户点击它多次，那么就不会在第一个之后触发任何事件。

您可以使用jQuery的解除绑定方法：http://api.jquery.com/unbind/ 或你也可以使用jQuery的关闭方式：http://api.jquery.com/off/

这将注销“click”事件。

下面是一个伪代码：

When user clicks on "form link" then 
    remove click event 
    perform ajax request

一旦你做到了这一点，你再需要找到一个策略，以重新注册的情况下，例如在“页面刷新”或一定量的时间后（如使用setTimeout()）等...

希望它有帮助！

祝你好运！

编辑：

，我只是想的是，你可以添加一个类的链接元素，以确定是否该链接已经被点击或不另一种策略。

$("#clickBalanceLeave").click(function() { 

    if ($(this).hasClass("clicked") == false) 
    { 
     $(this).addClass("clicked"); 

     //do ajax stuff 
    } 

});

然后，您需要找出一个删除该类的策略。如果你想重新启用功能。

答

使用额外的布尔变量来跟踪加载的数据。在ajax的成功函数中设置该变量，并在click函数中添加if条件来调用ajax，但前提是数据未加载。

Ahem - 是的，正是我所做的，我只是提供代码。 – mplungjan

多次点击相同的按钮获取相同的值多次在表格

相关推荐