使用动态添加的项目更新更改事件处理程序

时间:2019-01-21 20:18:37

标签: javascript jquery

我有一个单选组的预定义事件处理程序,然后将新的单选按钮动态添加到该组中。事件处理程序不会为动态添加的控件触发。我是否需要重新触发?我想像现在一样将原始定义保留在$(document).ready(…)中。

// Change Event Handler
$('input[name="group"]').off('change.test').on('change.test', function() {
  $('#status').html('Change Fired - ' + new Date().getTime());
});

$('#add').click(function() {
  if (!$('#act4').length) {
    $('#form').append('<input type="radio" name="group" id="act4" value="4" /><label for="act4">Activity 4</label>' +
      '<input type="radio" name="group" id="act5" value="5" /><label for="act5">Activity 5</label>');
  } else {
    $('#status').html('Already added 2 buttons');
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.3/jquery.min.js"></script>
<form id="form">
  <input type="radio" name="group" id="act1" value="1" />
  <label for="act1">Activity 1</label>
  <input type="radio" name="group" id="act2" value="2" />
  <label for="act2">Activity 2</label>
  <input type="radio" name="group" id="act3" value="3" />
  <label for="act3">Activity 3</label>
</form>
<button id="add" value="Add 2 more">Add 2 More</button>
<br/>
<div id="status"></div>

0 个答案:

没有答案