javascript - 选择特定输入并向其添加事件

Question

我遇到了一个令人沮丧的问题。 我想在动态添加的输入上添加点击事件，但我已经为此苦苦挣扎了一段时间。

为了显示一些代码，这是我的初始 View

<div class="js-item-list"></div>

然后用户可以动态添加数据，然后填充该 div，例如像这样(使用初始 div)

<div class="js-item-list">
  <div class="js-service-list-item>
    <table>
      <tr>
       <td>Something</td>
       <td><input type="text" class="js-consumption"></td>
      </tr>
    </table>
  </div>
  <div class="js-service-list-item>
    <table>
      <tr>
       <td>Something</td>
       <td><input type="text" class="js-consumption"></td>
      </tr>
    </table>
  </div>
  ... and so on ...
</div>

我想使用 jQuery 将单击事件添加到所有输入，以便当用户单击输入时，将选择该特定输入框的所有内容。但我不知道如何做，所以所有建议将不胜感激，谢谢:)

Answer 1

您可以对新添加的或将来的元素使用委托(delegate)方法

refrence

 $('.js-item-list').delegate('input', 'click', function(e) {
     //some code here
 })

或者对于较新版本 >1.7 的 jquery，您应该使用 .on()

As of jQuery 1.7, .delegate() has been superseded by the .on() method

$('.js-item-list').on('input', 'click', function(e) {
         //some code here
     })