首页 > 代码库 > Jquery 读取表单选中值
Jquery 读取表单选中值
1、获取复选框的选中值
<title> JS 获取复选框选中的值</title> <script src="http://www.mamicode.com/jquery-1.11.2.min.js"></script> </head> <body> <input type="checkbox" value="http://www.mamicode.com/01" class="ck" /> <input type="checkbox" value="http://www.mamicode.com/02" class="ck" /> <input type="checkbox" value="http://www.mamicode.com/03" class="ck" /> <input type="checkbox" value="http://www.mamicode.com/04" class="ck" /> <input type="checkbox" value="http://www.mamicode.com/05" class="ck" /> <input type="button" value="http://www.mamicode.com/取选中" id="btn" /> <script type="text/javascript"> $("#btn").click(function(e) { var ck = $(".ck"); for(var i=0;i<ck.length;i++ ) { if(ck[i].checked) { alert (ck[i].value); } } }); </script>
JQUERY
<title> JQUERY 获取复选框选中的值</title> <script src="http://www.mamicode.com/jquery-1.11.2.min.js"></script> </head> <body> <input type="checkbox" value="http://www.mamicode.com/01" class="ck" /> <input type="checkbox" value="http://www.mamicode.com/02" class="ck" /> <input type="checkbox" value="http://www.mamicode.com/03" class="ck" /> <input type="checkbox" value="http://www.mamicode.com/04" class="ck" /> <input type="checkbox" value="http://www.mamicode.com/05" class="ck" /> <input type="button" value="http://www.mamicode.com/取选中" id="btn" /> <script type="text/javascript"> $("#btn").click(function(e) { var ck = $(".ck"); for(var i=0;i<ck.length;i++ ) { if(ck.eq(i).prop("checked")) { alert (ck.eq(i).val()); } } }); </script>
2. JQUERY 取单选框的选中值
<title> JQUERY 取单选框的选中值</title> <script src="http://www.mamicode.com/jquery-1.11.2.min.js"></script> </head> <body> <input type="radio" value="http://www.mamicode.com/01" class="rd" name="a" /> <input type="radio" value="http://www.mamicode.com/02" class="rd"name="a" /> <input type="radio" value="http://www.mamicode.com/03" class="rd" name="a" /> <input type="radio" value="http://www.mamicode.com/04" class="rd" name="a"/> <input type="radio" value="http://www.mamicode.com/05" class="rd" name="a"/> <input type="button" value="http://www.mamicode.com/取单选" id="b2" /> <script type="text/javascript"> $("#b2").click(function(e) { var B = $(".rd"); for(var i=0;i<B.length;i++) { if(B.eq(i).prop("checked")) alert (B.eq(i).val()); } }); </script>
3. JQUERY 取复选框选中的值,这里不能用attr(),会出现Bug,所以会用prop()属性,然后将自身的状态再给到复选框
<title>JQUERY 取复选框选中的值</title> <script src="http://www.mamicode.com/jquery-1.11.2.min.js"></script> </head> <body> <input type="checkbox" id="qx" />全选 <input type="checkbox" value="http://www.mamicode.com/01" class="ck" />01 <input type="checkbox" value="http://www.mamicode.com/02" class="ck" />02 <input type="checkbox" value="http://www.mamicode.com/03" class="ck" />03 <input type="checkbox" value="http://www.mamicode.com/04" class="ck" />04 <input type="checkbox" value="http://www.mamicode.com/05" class="ck" />05 <input type="button" value="http://www.mamicode.com/取多选" id="btn" /> <script type="text/javascript"> $("#qx").click(function(e) { var xz = $(this).prop("checked"); $(".ck").prop("checked",xz); }); </script>
4.JQUERY获取下拉列表的选中值
<title> JQUERY 获取下拉列表的选中值</title> <script src="http://www.mamicode.com/jquery-1.11.2.min.js"></script> </head> <body> <select id="sel"> <option value="http://www.mamicode.com/11111">aaaaa</option> <option value="http://www.mamicode.com/22222">bbbbb</option> <option value="http://www.mamicode.com/33333">ccccc</option> </select> <input type="button" value="http://www.mamicode.com/取下拉" id="b1" /> <script type="text/javascript"> $("#b1").click(function(e) { alert ($("#sel").val()); }); </script>
Jquery 读取表单选中值
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。