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"/>