jquary获取单选,多选,select的值

Posted user_孙

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jquary获取单选,多选,select的值相关的知识,希望对你有一定的参考价值。

 1 <%@ page contentType="text/html; charset=UTF-8"%>
 2 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
 3 <html>
 4 <head>
 5 <script src="component/jquery-1.11.1.js"></script>
 6 <script>
 7 $(document).ready(function() {
 8     $("[name=‘radioGroup‘]").on("change",function() {
 9         var radioValue = $(this).val();
10         $("#radioText").text("单选按钮的值:"+radioValue);
11     });
12     
13     $("[name=‘checkGroup‘]").on("change",function() {
14         var array = new Array();
15         $("[name=‘checkGroup‘]:checked").each(function(){
16             var cbVal = $(this).val();
17             array.push(cbVal);
18         });
19         
20         $("#checkBoxText").text("多选按钮的值:" + array.join(","));
21         if ($("[name=‘checkGroup‘][value=‘1‘]").is(:checked)) {
22             $("#checkBoxText1").text("多选按钮1被选中");
23         } else {
24             $("#checkBoxText1").text("");
25         }
26     });
27     
28     $("[name=‘selectGroup‘]").on("change",function() {
29         $("#selectText").text($(this).val());
30     });
31     
32     $("[name=‘selectGroup1‘]").on("change",function() {
33         $("#selectText1").text($(this).val());
34     });
35 });
36 </script>
37 </head>
38 <body>
39     <input type="radio" name="radioGroup" value="1" />单选按钮1
40     <input type="radio" name="radioGroup" value="2" />单选按钮2
41     <br>
42     <font color="red" id="radioText"></font>
43     <hr/>
44     <input type="checkbox" name="checkGroup" value="1"/>多选按钮1
45     <input type="checkbox" name="checkGroup" value="2"/>多选按钮2
46     <input type="checkbox" name="checkGroup" value="3"/>多选按钮3
47     <br>
48     <font color="red" id="checkBoxText"></font><br>
49     <font color="red" id="checkBoxText1"></font>
50     <hr/>
51     <select name="selectGroup">
52         <option value="1">select1</option>
53         <option value="2">select2</option>
54         <option value="3">select3</option>
55     </select>
56     <br>
57     <font color="red" id="selectText"></font>
58     <hr/>
59     <select name="selectGroup1" multiple="multiple">
60         <option value="1">select1</option>
61         <option value="2">select2</option>
62         <option value="3">select3</option>
63     </select>
64     <br>
65     <font color="red" id="selectText1"></font>
66 </body>
67 </html>

 

以上是关于jquary获取单选,多选,select的值的主要内容,如果未能解决你的问题,请参考以下文章

js控制select只能单选

vant实现select效果,单选和多选

IT小鲜肉 Widgets Tree 单选多选相关回调函数获取选中的节点功能

Jquery获取列表中的值和input单选多选框控制选中与取消

jquery 怎样获取select多选下拉框所有选项的值

JS获取select option获取选中的值多选