jquery 点击按钮获取动态添加的 tr中 input text 内容

<table class="tableSt1 text-left" >
<tr>
<th width="40">排序</th>
<th>项目名称</th>
<th width="50">操作</th>
<th width="50">修改</th>
</tr>
<c:forEach items="${projectHot26005s}" var="zslb">
<tr id="sj1">
<td><input type="text" id="txt" value="" maxlength="2" id="txt"></td>
<td>${zslb.projectName }</td>
<td><button class="btn btn-red r3 margin" onclick="btnDelete('${zslb.projectId }')">删除</button></td>
<td><button class="btn btn-red r3 margin" onclick="change()">修改</button></td>
</tr>
</c:forEach>
</table>
这是页面
function change(txt){
var text ="";
var len = $("input[type=text]").length;
$("#sj input[type=text]").each(function(){
text = $(this).val();
});
console.log(text);
}
这是js
现在的效果是不论点哪一行的修改按钮 都只能获取最后一行的内容

我想分别点击某一行的修改按钮 就获得哪一行的input text value

这是页面效果
jquery 代码应该是
function change(txt){
var text ="";
var len = $("input[type=text]").length;
$("input[type=text]").each(function(){
text = $(this).val();
});
console.log(text);
}

按照要求,在点击每一行的修改按钮,需要获取对应行的第一列input的value值,对应的js代码参考下方:

function change(){
   var text = $(this).parents('tr').children('td:eq(0)').children('input').val();
   console.log(text);
}

还有更加简便的方法:在forEach循环生成tr和td元素时,按照如下规则生成td元素:

<c:forEach items="${projectHot26005s}" var="zslb">
<tr id="sj1">
<td><input type="text" id="txt${zslb.projectId}" value="" maxlength="2"></td>
<td>${zslb.projectName }</td>
<td><button class="btn btn-red r3 margin" onclick="btnDelete('${zslb.projectId }')">删除</button></td>
<td><button class="btn btn-red r3 margin" onclick="change('${zslb.projectId}')">修改</button></td>
</tr>
</c:forEach>

这样在change方法中就能通过唯一的id来定位到指定的input,既而获取到value值:

function change(id){
   var text = $("#txt" + id).val();
   console.log(text);
}
温馨提示:答案为网友推荐,仅供参考

相关了解……

你可能感兴趣的内容

本站内容来自于网友发表,不代表本站立场,仅表示其个人看法,不对其真实性、正确性、有效性作任何的担保
相关事宜请发邮件给我们
© 非常风气网