2 回答

TA貢獻1871條經驗 獲得超13個贊
您需要在“add_other”容器的 id 內設置 3 個新容器。
function addoptions() {
$('#add_other').append('<div>' + '<input type="radio" class="custom-control-input" name="defaultExampleRadios">' + '<input type="search" name="" value="">' + '<button class="remove" onclick="removeDiv(this);">X</button>' + "</div>");
}
function removeDiv(btn) {
((btn.parentNode).parentNode).removeChild(btn.parentNode);
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.1/jquery.min.js"></script>
<div class="custom-control custom-radio" id="add_other">
<div id="container0">
<input type="radio" class="custom-control-input" name="defaultExampleRadios">
<input type="search" name="" value="">
</div>
<div class="custom-control custom-radio">
<input type="radio" class="custom-control-input" name="defaultExampleRadios">
<input type="search" name="" value="">
<button class="remove" onclick="removeDiv(this);">X</button>
</div>
<div class="custom-control custom-radio">
<input type="radio" class="custom-control-input" name="defaultExampleRadios">
<input type="search" name="" value="">
<button class="remove" onclick="removeDiv(this);">X</button>
</div>
<div class="custom-control custom-radio">
<input type="radio" class="custom-control-input" name="defaultExampleRadios">
<input type="search" name="" value="">
<button class="remove" onclick="removeDiv(this);">X</button>
</div>
</div>
<div class="custom-control copy-radio" onclick="addoptions()">
<label class="add_option" id="add_othe1r">Add More</label>
</div>

TA貢獻1808條經驗 獲得超4個贊
您將 id 設置add_other為“添加選項”按鈕容器。您需要刪除它并將 id 重置為第一個div容器
var index = 1;
function addoptions() {
$('#add_other').append(`<div id="container${index}" >` + '<input type="radio" class="custom-control-input" name="defaultExampleRadios"/>' + `<input type="search" name="text" onsearch="deleteRadio(${index})"/>` + "</div>");
index ++;
}
function deleteRadio(ind) {
$(`#container${ind}`).remove();
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.1/jquery.min.js"></script>
<div id="hidden_radio_buttons" class="radio_buttons" style="margin:10px;">
<!-- Default unchecked -->
<div class="custom-control custom-radio" id="add_other">
<div id="container0">
<input type="radio" class="custom-control-input" id="defaultUnchecked" name="defaultExampleRadios">
<input type="search" name="" value="" placeholder="option 1" onsearch="deleteRadio(0)">
</div>
</div>
<!-- Default unchecked -->
<div class="custom-control copy-radio" onclick="addoptions()">
<input type="radio" class="custom-control-input" name="defaultExampleRadios">
<label class="add_option" id="add_othe1r">Add Option</label>
</div>
</div>
添加回答
舉報