在JavaScript中我有以下功能
function addMore(){
var html = $('.wrapper').html();
$(".insert-after").after(html);
}
在HTML中我有以下代码
<div class="wrapper">
<select name="s_allergies[][]" multiple required>
<option value="none">None</option>
<option value="Gluten">Gluten Allergy</option>
<option value="Nut">Nut Allergy</option>
<option value="Shellfish">Shellfish Allergy</option>
<option value="Lactose">Lactose Allergy</option>
<option value="Egg">Egg Allergy</option>
<option value="Vegetarian">Vegetarian</option>
<option value="Vegetarian with Seafood">Vegetarian/Seafood</option>
<option value="No Pork">No Pork</option>
<option value="No Red Meat">No Red Meat</option>
</select>
</div>
在我的应用程序中,我有一个“添加更多”按钮,将复制和粘贴字段。为了让我通过php处理它们我需要一种方法来将选择字段的名称增加为“s_allergies [1] [] .... s_allergies [2] []”等等。但是,我不能似乎可以使用它
我不是javascript的专业人士,有人可以指导我一点吗?
谢谢
首先,你需要为你的select定义一个ID,如果你有多个,那么这就是你需要在普通JS中做的事情
function addMore(){
child=document.createElement('option');
child.text='Some Text';
child.val='some Value';
document.getElementById('selector').appendChild(child);
}
<div class="wrapper">
<select id="selector" name="s_allergies[][]" multiple required>
<option value="none">None</option>
<option value="Gluten">Gluten Allergy</option>
<option value="Nut">Nut Allergy</option>
<option value="Shellfish">Shellfish Allergy</option>
<option value="Lactose">Lactose Allergy</option>
<option value="Egg">Egg Allergy</option>
<option value="Vegetarian">Vegetarian</option>
<option value="Vegetarian with Seafood">Vegetarian/Seafood</option>
<option value="No Pork">No Pork</option>
<option value="No Red Meat">No Red Meat</option>
</select>
<button onClick=addMore()>Click</button>
</div>
这使用jQuery:
function addMore(){
$('#selector').append($('<option value="someValue">Some Text</option>'));
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="wrapper">
<select id="selector" name="s_allergies[][]" multiple required>
<option value="none">None</option>
<option value="Gluten">Gluten Allergy</option>
<option value="Nut">Nut Allergy</option>
<option value="Shellfish">Shellfish Allergy</option>
<option value="Lactose">Lactose Allergy</option>
<option value="Egg">Egg Allergy</option>
<option value="Vegetarian">Vegetarian</option>
<option value="Vegetarian with Seafood">Vegetarian/Seafood</option>
<option value="No Pork">No Pork</option>
<option value="No Red Meat">No Red Meat</option>
</select>
<button onClick=addMore()>Click</button>
</div>