无法根据使用jQuery

/*Add new div(content)*/ 
<div class="form-group"> 
<button type="button" class="btn-primary btn-sm" id="add-phone">Add</button> 
</div> 

<script type='text/javascript'> 
var max_fields = 3; //maximum input boxes allowed 
var x = 1; //initlal text box count 

    $('#add-phone').click(function() { 
     if(x < max_fields){ //max input box allowed 
      x++; //increment when a new div(section) is added. 
     //content of added section(div) 
     $("#add-request").after('<div class="col-md-12" id="site-phone"> 
     <select name='phone-manufacture' id="phone-manufacture"> 
     <option value="apple">Apple</option><option value="sam">Samsung</option></select></div>'); 
    }); 

$(document).ready(function() { 
    $('#phone-manufacture').change(
     function() { 
      var method = $('option:selected').val(); 
      if (this.value == 'apple'){ 
       //show different content(Fields, text or another select) 
      }else if(this.value == 'sam'){ 
       //show something else or append a new element.. 
      } 
     }); 
    }); 

</script>

这是我迄今为止添加方法动态地显示不同的内容，但增加的第一个div（按Add按钮一次），但加入了第二个div（内容时，当它只能 - 第二次按下添加按钮）或第三个div（内容）不再显示If块上指定的不同元素。无法根据使用jQuery

来源

2017-02-26 user1533578

这个问题不是很清楚，你可以进一步解释你喜欢做什么吗？ – Greeso

我想每次按下添加按钮都会添加一个新的div。一旦新的div显示，它会显示选择选项wh用户可以选择选项1或2.基于选择，然后将显示文本字段..我已经完成了..问题是，当用户再次单击添加按钮..动态文本字段不显示。 – user1533578

您正在创建具有相同ID的新元素。每个元素都应该有一个唯一的ID。你应该为你的改变功能使用一个类引用，而不是一个ID引用（参见下面的示例，我已经添加了一个名为phone-manufacture的类，并将它用于你的更改函数）。另外，请注意我已经使用$(document).on 。变化的功能。这是因为，当你动态地添加的元素，你需要将事件处理程序附加到非动态元素：

<script type='text/javascript'> 

$(document).ready(function() { 
var max_fields = 3; //maximum input boxes allowed 
var x = 1; //initlal text box count 

$('#add-phone').click(function() { 
    if(x < max_fields){ //max input box allowed 
     x++; //increment when a new div(section) is added. 
     //content of added section(div) 
     $("#add-request").after('<div class="col-md-12" id="site-phone"><select name="phone-manufacture" id="phone-manufacture" class="phone-manufacture"> <option value="apple">Apple</option><option value="sam">Samsung</option></select></div>'); 
    } 
}); 



    $(document).on('change','.phone-manufacture', function(){ 
      var method = $('option:selected').val(); 
      if (this.value == 'apple'){ 
       //show different content(Fields, text or another select) 
      }else if(this.value == 'sam'){ 
       //show something else or append a new element.. 
      } 
     }); 
}); 

</script>

注：我没有在这个改变你的ID，但你也应该解决这个问题

来源

2017-02-26 20:37:47

无法根据使用jQuery

回答

相关问题