我正在尝试使用 jQuery 将动态表单元素添加到我的页面。目前，我可以在用户单击按钮时添加我的表单元素之一，但第二个元素没有被添加。
我通过在单击按钮时将一些 html 附加到具有特定类的 div 来实现这一点。
我创建了一个 JSfiddle。如您所见，“成分”部分有效，但数量无效。
https://jsfiddle.net/fe0t3by2/
$('.recipe-ingredients #addNewIngredient').on('click', function () {
var i = $('.recipe-ingredients .ingredient').size() + 1;
$('<div class="form-group ingredient"><label class="control-label" for="searchinput">Ingredients</label><div><input id="ingredient_' + i + '" name="ingredients[]" type="text" placeholder="Ingredients" class="form-control input-md"></div></div><a href="javascript:void(0)" class="pure-button pure-u-1-6 pure-button-primary" id="addNewIngredient">Add Ingredient</a></div>').appendTo($('.recipe-ingredients .ingredients'));
$('<div class="form-group"><label class="control-label" for="buttondropdown">Quantity</label><div class="input-group"><input id="quantity_' + i + '" name="quantity[]" class="form-control" placeholder="Quantity" type="text"><div class="input-group-btn"><button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">Measure<span class="caret"></span></button><ul class="dropdown pull-right"><li><a href="#">Grams</a></li><li><a href="#">Ounces</a></li><li><a href="#">Option three</a></li></ul></div></div>').appendTo($('.recipe-quantities .quantities'));
});
谢谢
最佳答案
您在数量 div 中拼错了“recipe-quantities”类别。
<div class="col-md-6 recipe-quantites">
改为
<div class="col-md-6 recipe-quantities">
关于javascript - 添加动态表单元素 jQuery，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/34308861/