類不在DOM中更新，處理程序工作不正常

所以，我不確定這是否是正確的方法，但我聽說使用內聯onclick處理程序而不是jQuery處理程序不是一個好主意。類不在DOM中更新，處理程序工作不正常

我有一個用戶的儀表板，用一個按鈕來阻止/取消阻止用戶。下面是我使用的阻止他們的辦法：我有一個類似的功能

<script> 
    $('.fa-unlock-alt').parent().on('click', function() { 
     var $button = $(this) 
     var id = $button.attr('id').slice(12); 
     console.log($(this)); 


     $.ajax({ 
      method: 'POST', 
      url: '/Websites/TimeTracking/Resources/PHP/Users/blockUser.php', 
      data: {idUser: id, status: 'Inactivo'}, 
      success: function (result) { 
       if (result == "Exito") { 
        alert("El acceso del usuario ha sido bloqueado!"); 
        $button.find('i').toggleClass('fa-unlock-alt fa-lock'); 
        $button.removeClass('btn-outline-success').addClass('btn-outline-danger'); 
       } 
       console.log(result); 
      }, 
      error: function (exception) { 
       alert("No se pudo bloquear el acceso!"); 
       console.log(exception); 
      } 
     }) 
    }) 
</script>

，但它看起來對.fa-lock，而不是fa-unlock-alt，它類似的行動，而是改爲解開鎖定。

DOM加載完成後，第一次單擊該按鈕時它可以正常工作，ajax調用已成功完成，我的數據庫也會相應地更新，並且按照設想更改類，但每當我嘗試再次單擊它時，它將無法工作。

一個快速調試表明，即使瀏覽器顯示我想要的顏色和形狀，DOM實際上已經在元素的屬性上註冊了默認值。

我應該採取不同的方法嗎？

謝謝！

來源

2017-02-21 Lalo Santos

我建議你使用（最接近的）[https://api.jquery.com/closest/]而不是父母，但..如何？很容易，放一個類或者只是搜索父標籤名，你就可以確定你正在聽正確的標籤。順便問一下，可以問你是否使用''ready''函數？ –

不使用'ready'功能。我應該在哪裏？ –

如果您單擊按鈕來鎖定用戶，爲什麼要再次單擊它。你是否重新鎖定somoene？ – chiliNUT

也許你應該在父元素（delegate）上註冊點擊處理程序。像

$('.parent-element-selector-here').on('click', '.fa-unlock-alt, .fa-lock', function() { 

    var $button = $(this); 

    if ($button.hasClass('fa-unlock-alt')) { 

     // do this 

    } else { 

     // do that 

    } 

});

來源

2017-02-21 00:12:58

讓我試試吧，我會很快給你提供反饋。 –

我完全是這樣想的，但它甚至不會識別按鈕上的點擊 –

有些東西並不完全像這樣，它在工作：https://jsfiddle.net/57uuxfyc/ –

類不在DOM中更新，處理程序工作不正常

回答

相關問題