Question

在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>

在我的应用中，我有一个＆＃34;添加更多＆＃34;将复制和粘贴字段的按钮。为了让我通过php处理它们，我需要一种方法来将选择字段的名称增加为＆＃34; s_allergies [1] [] .... s_allergies [2] []＆＃34;等等。但是，我似乎无法使用

让它工作

我不是javascript的专家，有人可以指导我一点吗？

感谢

https://codepen.io/anon/pen/baqNKx

Answer 1

首先，你需要为你的选择定义一个ID，以防你有多个，那么这就是你需要在普通JS中做的事情

＆＃13;

function addMore(){
  child=document.createElement('option');
  child.text='Some Text';
  child.val='some Value';
  document.getElementById('selector').appendChild(child);
}

＆＃13;

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

＆＃13;

这是使用jQuery：

＆＃13;

function addMore(){
  $('#selector').append($('<option value="someValue">Some Text</option>'));
}

＆＃13;

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

＆＃13;

添加名称为+ x

1 个答案: