專注於多次調用

我想要在用戶離開帶有類選擇器名稱「data」的輸入時進行ajax調用。我的問題是聚焦事件被稱爲多次。專注於多次調用

$(document).ready(function(){ 
var test2=0; 
$(document).on('focus', '.data', function() { 
    $this = $(this); 
    $this.focusout(function(){ 
      $('div.debug2').text(test2++); 
    });  
}); 
    });

這裏是我的html：

<c:forEach var="user" items="${users}"> 
<tr id='user_${user.id}' class="datarow"> 
    <td><input class="data" type="text" name="role" value="${user.role }"></td> 
    <td><input class="data" type="text" name="fullName" value="${user.fullName }"></td>         
</tr> 
</c:forEach> 
<div class="debug2">Focus Out</div>

我做了什麼錯？如果有什麼辦法可以更好地處理這個問題，請告訴我。謝謝

來源

2014-06-28 user2747502

您正在設置一個專注事件處理程序，每次獲得焦點時。所以，每當一個領域失去焦點時，就會有最多的事件與任何領域集中的次數一樣多。

您應該只在文檔上設置聚焦事件處理程序一次，因此請從on函數中刪除代碼並放在它旁邊。

來源

2014-06-28 18:44:07

我想的$（document）。在（ '專注'，' .data'，函數（）..意味着它只是類選擇器名稱「data」？ – user2747502

是的，但問題在於每次調用'focus'處理函數時，都會有一個** new **'focusout'處理函數被創建，並最終加起來。 –

哦，我明白了，我認爲當在選擇器上創建新的聚焦點時，它會刪除以前的那些。 – user2747502

無需綁定到集中時，所有你需要的是focusOut事件

***改變了代碼來測試，如果該值已更改

$(document).ready(function(){ 
     $(document).on('focusout', '.data', function() { 
     var current = $(this), 
      oldVal = current.data("oldVal"); 
     if(this.value === oldVal) 
     { 
     return; 
     } 
     current.data("oldVal", this.value); 
     //make ajax call 
    }); 
    });

來源

2014-06-28 18:57:03

我知道，但我想比較舊的和新的價值來決定是否進行ajax調用。 – user2747502

更改了代碼以反映您的請求 –

您的問題，每次重點您附加另一個.focusout事件的對象呈指數級增長。

使用

$(document).ready(function(){ 
    var test2=0; 
    $(document).on('focusout', '.data', function() { 
    //do whatever you need 
    }); 
    });

或取消綁定任何你設置一個新的前一個事件，但是這是一個糟糕的代碼

$(document).ready(function(){ 
     var test2=0; 
     $(document).on('focus', '.data', function() { 
     $('.data').unbind('focusout'); 
     $(document).on('focusout', '.data', function() { 
      }); 
     });

來源

2014-06-28 19:35:13

專注於多次調用

回答

相關問題