我试图弄清楚如何在使用 insertBefore 函数 jQuery 后更新元素 LI。
问题是在向 UL 添加任何新元素后,我无法删除相同的元素(使用 emailTagRemove)。
看demo看问题: http://jsfiddle.net/HsRfH/
<div class="content">
<span class="">Please, insert one or more emails: </span>
<br />
<ul id="ulEmailsCotacao" class="ulEmailsCotacao">
<li class="liEmailTagNew">
<input type="text" class="emailInputTag" name="" value="" />
</li>
</ul>
</div>
//if enter, tab or space, add new value
$('.emailInputTag').keydown(function (e) {
var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0;
if (key === 13 || key === 9 || key === 32) {
addEmail();
}
});
addEmail = function () {
var email = $('.emailInputTag').val().trim();
$('<li class="liEmailTagChoiced">' + email + '<a id="del" class="emailTagRemove">x</a></li>').insertBefore('.liEmailTagNew');
$('.emailInputTag').val("");
};
$('.emailTagRemove').click(function () {
var email = $(this).parents("li");
email.remove();
});
最佳答案
您需要使用 event delegation为此,由于动态添加/删除了元素:
$('.content').on('click', '.emailTagRemove', function () {
var email = $(this).parents("li");
email.remove();
});
使用 .content
作为选择器,因为在这种情况下它比使用 document
更有效。
关于javascript - 如何在插入 jQuery 后更新/刷新 DOM 项,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22873979/