Dynimically添加html元素绑定onclick事件到其他dynimically添加html元素

Question

我知道这个问题的一部分已被问及我跟着它的答案，但它仍然无法正常工作（添加的HTML元素不显示）， 你可以帮帮我吗 ？ 我想在标签和条目，只显示在选择下拉菜单的一个选项

这里的HTML部分：

<select id="dropDown"> 
    <option value='1'>Doesn't repeat</option> 
    <option value='2' id="repeatChange">Daily</option> 
    <option value='3' id="repeatChange">Weekly</option> 
    <option value='4' id="repeatChange">Biweekly</option> 
    <option value='5' id="repeatChange">Monthly</option> 
</select> 
<label id="labelHowMuch">How many times ?</label> 
<input type="text" id="repeatHowMuch" class="text ui-widget-content ui-corner-all"/> 

而这里的jQuery的一部分：

$('#labelHowMuch').remove(); 
$('#repeatHowMuch').remove(); 
$(document).on('click', '#repeatChange' , function() { 
    $('#labelHowMuch').append($('#dropDown')); 
    $('#repeatHowMuch').append($('#labelHowMuch')); 
}); 

提前致谢 ！

Answer 1

这是你做了很多错误的正确方法是：

$('#labelHowMuch').hide(); 
 
$('#repeatHowMuch').hide(); 
 
$(document).on('change', '#dropDown' , function() { 
 
    if($(this)[0].value != 1){ 
 
     $('#labelHowMuch').show(); 
 
     $('#repeatHowMuch').show(); 
 
    } 
 
    else{ 
 
     $('#labelHowMuch').hide(); 
 
     $('#repeatHowMuch').hide();  
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select id="dropDown"> 
 
    <option value='1'>Doesn't repeat</option> 
 
    <option value='2'>Daily</option> 
 
    <option value='3'>Weekly</option> 
 
    <option value='4'>Biweekly</option> 
 
    <option value='5'>Monthly</option> 
 
</select> 
 
<label id="labelHowMuch">How many times ?</label> 
 
<input type="text" id="repeatHowMuch" class="text ui-widget-content ui-corner-all"/>