gpt4 book ai didi

javascript - 附加到具有重复类的 div

转载 作者:太空宇宙 更新时间:2023-11-03 23:56:15 24 4
gpt4 key购买 nike

我有一段 JS,它通过单击按钮将以下内容附加到 Web 表单。单击 div .remove 时,最接近的 new-attribute div 将被删除。它工作正常。

<div class="new-attribute">
<h3>New Attribute</h3>

<label for="attributeName3">Name:</label>
<input class"attribute"="" type="text" name="attributeName3">

<label for="attributeType3">Type:</label>
<select id="t" class="attribute" name="attributeType3">
<option value="text" selected="">Text</option>
<option value="checkbox">Checkbox</option>
<option value="select-list">Select Option List</option>
<option value="notes">Notes</option>
</select>

<div class="option"></div>
<div class="remove">Delete</div>
</div>

在 div“选项”中,我有代码在选择输入中选择“选择列表”时添加另一个表单字段。这是行不通的。我不知道为什么。没有变量名冲突。我不在,我不应该给选择一个 ID,因为它是经常性的,我只是想让它在我让它合规之前工作。

这是我遇到问题的 Js:

//select temp
var select="<div class=\"new-option\">"
+ "<h3>new option</h3>"
+ "<label for=\"attributeName"+count+"\">New otion:</label>"
+ "<input class\"attribute\" type=\"text\" name=\"attributeName"+count+"\">"
+ "</div>";

//get value of select
$('#t').change(function() {
var selectVal = $('#t :selected').val();
if (selectVal == "select-list") {
$(this).closest('.option').append(select);
}
});

代码适用于 $(select).appendTo('.option');但是它将代码附加到页面上“选项”类的每个实例。我只希望它附加到当前或最近的一个。

提前致谢

最佳答案

问题是因为 closest() 查找 DOM 以寻找与选择器匹配的最近的父元素,但是 .option#t< 的兄弟元素。尝试使用 next() 代替:

$('#t').change(function() {
if ($(this).val() == "select-list") {
$(this).next('.option').append(select);
}
});

关于javascript - 附加到具有重复类的 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18548824/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com