jquery实现获取checkbox选中的那一行input的值

在jquery中 , 通过“:checked”选择器获得被选中的checkbox对象 , 使用next()方法可以获得当前行的input对象 , 使用val()方法便可以获得input的值 。 下面小编举例讲解jquery实现获取checkbox选中的那一行input的值 。

jquery实现获取checkbox选中的那一行input的值

文章插图

需要这些哦
html+jquery
代码编纂器:Dreamweaver CS5
方式/
1新建一个html文件 , 定名为test.html , 用于讲解jquery实现获取checkbox选中的那一行input的值 。
jquery实现获取checkbox选中的那一行input的值

文章插图

2在test.html文件内 , 在p标签内 , 利用input标签建立一个checkbox选项和一个文本框 , 而且文本框设置默认值 。
jquery实现获取checkbox选中的那一行input的值

文章插图

3在test.html文件内 , 给每一个checkbox类型input元素设置name属性 , 同一设置为ck , 本家儿要用于下面经由过程该name获得input对象 。
jquery实现获取checkbox选中的那一行input的值

文章插图

4在test.html文件内 , 利用button标签建立一个按钮 , 按钮名称为“获得input值” 。
jquery实现获取checkbox选中的那一行input的值

文章插图

5在test.html文件中 , 给button按钮绑定onclick点击事务 , 当按钮被点击时 , 执行getinput函数 。
jquery实现获取checkbox选中的那一行input的值

文章插图

6在js标签中 , 建立getinput()函数 , 在函数内 , 经由过程“:checked”选择器获得被选中的checkbox对象 , 利用next()方式获得checkbox相邻的input文本框对象 , 经由过程val()方式获得它的值 。 最后 , 利用alert()方式输出input的值 。
jquery实现获取checkbox选中的那一行input的值

文章插图

7在浏览器打开test.html文件 , 点击按钮 , 查看成果 。
jquery实现获取checkbox选中的那一行input的值

文章插图

总结:1【jquery实现获取checkbox选中的那一行input的值】1、建立一个test.html文件 。
2、在文件内 , 在p标签内 , 利用input标签建立一个checkbox选项和一个文本框 。 同时建立一个button按钮 , 用于触发执行js函数 。
3、在js标签内 , 建立函数 , 在函数内 , 经由过程“:checked”选择器获得被选中的checkbox对象 , 利用next()方式获得checkbox相邻的input文本框对象 , 经由过程val()方式获得它的值 。 最后 , 利用alert()方式输出input的值 。

注重事项:checked选择器可以获得被选中的checkbox对象

以上内容就是jquery实现获取checkbox选中的那一行input的值的内容啦 , 希望对你有所帮助哦!

    推荐阅读