如何用JQuery实现获取checkbox选中的那一行的input中的值

Posted 2023-05-11

<tr>
<td>
<input type="checkbox" name="roleId"/>
</td>
<td>
<input type="text" name="roleName"/>
<td/>
<td>
<input type="text" name="roleType"/>
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="roleId"/>
</td>
<td>
<input type="text" name="roleName"/>
<td/>
<td>
<input type="text" name="roleType"/>
</td>
</tr>

思路：通过 :checked 筛选 checkbox 选中项，然后进行遍历，利用节点关系获取到input对象，最后使用val()方法获取input的内容。实例演示如下:

1、html结构

<table>

    <tr>

        <td><input type="checkbox" name="test"></td>

        <td><input type="text"></td><td><input type="text"></td>

    </tr>

    <tr>

        <td><input type="checkbox" name="test"></td>

        <td><input type="text"></td><td><input type="text"></td>

    </tr>

</table>

<input type="button" value="确定">

2、jquery代码

$(function()

    $(":button").click(function()

        // 找到选中行的input

        var ipts = $(":checkbox:checked").parents("tr").find("input:text");  

        // 遍历input并使用val()方法获取值

        str = .map(function() return $(this).val();).get().join(", ");

        alert(str);

    );

); 

3、效果演示

参考技术A

这个你直接这样获取就可以

$("#roleId").val()//获取name的值即可。

如果在后台的表单获取的话也是这样，你只要获取这个值就行。我在这里以Struts2里面获取form表单对象的为例：

private String roleId；
public void setRoleId(String roleId) 
    this.roleId = roleId;

public String getRoleId() 
    return this.roleId;

把他的name定义为Action的一个属性，提供set get 方法即可获取值，简单好用。不需要那么麻烦

追问

我是要获取选中的一行里面的所有值不是只要ID啊

我是要获取选中的一行里面的所有值不是只要ID啊

参考技术B $(":checkbox:checked").closest("tr").find("input").each(function()
    ...
);

追问

each(function()这个里面怎么写啊

求QQ

追答$(":checkbox:checked").closest("tr").find(":text").each(function(i, eleDom)
    // 遍历每个被选中的复选框所在行的文本框的值, 看你怎么用了，你要哪个
    alert('第 ' + (i+1) + ' 个文本框的值: ' + eleDom.value);
);

本回答被提问者采纳 参考技术C

如下代码可以解决：

<script src="jquery-1.7.1.min.js" type="text/javascript"></script>
<script>
$(document).ready(function()
$("input[type=checkbox]").click(function()
var tr = $(this).parent("td").parent("tr");
tr.find("input[type=text]").each(function()
alert($(this).val());
);
);
);
</script>

如何判断checkbox复选框是否选中

如何判断checkbox复选框是否选中:
本章节介绍一下如何用jquery判断一个checkbox复选框是否被选中，方式有很多种，这里只是简单介绍一下比较常用的两种方式，不提供完整的代码，给出主要的代码片段。
方式一:

$("#ck").prop("checked")==true

关于prop()可以参阅jQuery的prop()方法一章节。
方式二:

$("#ck").is(":checked")

:checked可以参阅jQuery的:checked选择器一章节。