Question

如果用户删除或添加了div，我可以添加和删除DOM。第一次添加时，更改侦听器上的单选按钮会完全触发，但如果div被删除并重新添加，则onChange侦听器将不再起作用。

HTML

<div id="div_container">
   <input type="radio" name="gender" value="m"/>
   <input type="radio" name="gender" value="f"/>
</div>

JS

$(document).on('change', 'input[type=radio][name=gender]', function(){
     alert();
});

有人知道如何解决这个问题吗？

Answer 1

我认为这应该有效。我已经创建了你的代码的小提琴，它正在工作

 $(document).on('change', 'input[type=radio][name=gender]', function () {
        alert('hi');
    });

以下是小提琴链接：

https://jsfiddle.net/shrawanlakhe/2ukjLfp0/7/

Answer 2

使用function xxx(){}和.find

在事件“已添加”单选按钮

中调用它们

var radios = '<input type="radio" name="gender" value="m"/>M<input type="radio" name="gender" value="f"/>F';

function onRchange(){
  
    $(document).find('input[type=radio][name=gender]').on('change', function(){
        alert($(this).val());
     });
  
  }

var i = true;

$('#add-r').on('click',function(){  
  if(i){
    
    $('#div_container').html(radios);
    $(this).html('REMOVE');
    i = false;
  }else{
    $(this).html('ADD');
    $('#div_container').html('');
     i = true;
  }
  
  onRchange();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>



<div id="div_container">

</div>

<button id="add-r" >ADD</button>

添加到DOM的单选按钮上的Onchange侦听器

2 个答案: