JQueryのクリックイベントは、<tr>

Question

で一度しか動作しません。

今のところ、テーブルからすべてのtrで動作しています。これ以降は一度だけ動作するはずです。

$("#example tbody tr").on("click", function() { 
    $(this).addClass('row-selected');    
}) 

Answer 1

あなたはあなたの最初のクリック後クリックイベントをバインド解除する必要があります。

var tr = $("tr"); 
 
tr.one("click", function() {    // this means that you can only click each row once 
 
    $(this).toggleClass('row-selected'); 
 
    tr.off('click');      // this will unbind the click event from the rest of the rows 
 
})

.row-selected td { 
 
    font-weight: bold; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    <tr> 
 
    <td>one</td> 
 
    </tr> 
 
    <tr> 
 
    <td>one</td> 
 
    </tr> 
 
    <tr> 
 
    <td>one</td> 
 
    </tr> 
 
    <tr> 
 
    <td>one</td> 
 
    </tr> 
 
    <tr> 
 
    <td>one</td> 
 
    </tr> 
 
    <tr> 
 
    <td>one</td> 
 
    </tr> 
 
</table>

Answer 2

これを試してください。

$("#example tbody tr").one("click", function() { 
    $(this).addClass('row-selected');    
}) 

Answer 3

はoneの代わりonで試してみてください。あなたのクリックイベントコールバック内部onehttp://api.jquery.com/one/

("#example tbody tr").one("click", function() { 
    $(this).addClass('row-selected');    
}) 

Answer 4

についてのより多くのあなたがイベントを削除することができます。イベントをパラメータとして渡すだけです。

$("#example tbody tr").on("click", function(event) { 
    $(this).addClass('row-selected'); 
    event.target.onclick = null; 
}) 

Answer 5

// Try This 
jQuery(document).ready(function(){ 
$(document.body).on("click", '#example tbody tr', function() { 
    $(this).addClass('row-selected');    
}); 
}); 

Answer 6

（一つに "クリック" に変更してみてください（

を "クリック" 以下

$("#example tbody tr").one("click", function() { 
$(this).addClass('row-selected');    
})code here 

またはあなたがこのページにbind unbind

をチェックしてみてくださいしてみてください

リンク先のサイトで使用している例を示します。

$('#my-selector').bind('click', function() { 
    $(this).unbind('click'); 
    alert('Clicked and unbound!'); 
});