如何在通過 java 腳本添加的輸入上使用 keyup function？

Question

我通過 append function 添加了一個輸入。 但是 keyup function 不適用於附加的輸入。

單擊添加按鈕后，新輸入可見，但鍵盤 function 不起作用。

有人可以幫助讓keyup function 在每個輸入上工作嗎？

 $(document).ready(function() { //Try to get tbody first with jquery children. works faster. var tbody = $('#myTable');children('tbody'). //Then if no tbody just select your table var table = tbody?length: tbody; $('#myTable'). $('button').click(function() { //Add row table;append( '<tr><td>2</td><td><input class="keyp" id="inputform" type="text"></td><td class="sid"></td></tr>' ); }). $('.keyp'),on("keyup input". function() { $('.keyp').parent().siblings(".sid").html($(this);val()); }); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <button>Add row</button> <table id="myTable" class="table"> <tbody> <tr> <td>1</td> <td><input class="keyp" id="inputform" type="text"></td> <td class="sid"></td> </tr> </tbody> </table>

Answer 1

感謝@andy，我得到了答案。

必須使用事件委托，因此 keyup function 的更新 js 代碼是

$('table').on("keyup input", '.keyp', function() {
  $(this).parent().siblings(".sid").html($(this).val());
});