jquery获取不到动态append元素的值
1.问题： jquery获取不到动态append的input框的值
在处理⼀些逻辑的时候，我们可能会使⽤到动态append⼀些元素到页⾯上，这也会有⼀些问题
⽐如，append上的元素通过各种选择器获得的都是null，或者undefined。
2. 如何解决
这⾥介绍⼀下我经常使⽤的⽅法，适⽤与不同的场景
2.1 在append后直接绑定事件/获取值
在我们append⼀个元素的时候，直接在其js后⾯绑定上事件或者获取元素的值都是可以⽣效的。这也是最简单的⼀种办法。
2.2 使⽤delegate/on等（适⽤与各种事件）
我们可以使⽤delegate来给选择器选中的元素（包括未来的被选中的元素）来添加各种事件
如：我们要给下⾯的div添加⼀个⼦元素button，并给其绑定⼀个事件
<div id="d1">
</div>
js：
某⽅法：{
$('#d1').append('<button id=“b1”>点击</button>')
}
使⽤delegate绑定事件
$('#d1').delegate("b1","click", function(){
//点击事件的具体逻辑
alert("ok，u click it")
})
2.3 获取/遍历元素配合$(this).val()取值 (适⽤于获取值)
使⽤场景:
我们在⼀个div中append了多个input
div:<div id="d2"></div>
input:
<input id="ip1"/>
<input id="ip2"/>
<input id="ip3"/>
我们可以使⽤最基本的js获取
var list = ElementById('d2').getElementsByTagName('input');
然后通过遍历获取值，这⾥是存到了⼀个数组tempList中
$.each(list, function (i, item) {
jquery在一个元素后追加标签// 这⾥我们可以发现打印得是dom
console.log(item);
var temp = $(item).val();
if (!isNull(temp)){
tempList.push(temp);
}
});
// 打印查看是否成功获取
console.log(tempList);
ok，问题解决.
感觉有帮助的⼩伙伴记得点个赞哟~

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。