jQuery取得select选择的文本与值
1 jquery获取select选择的文本与值
2 获取select ：
3 获取select 选中的 text :
4 $("#ddlregtype").find("option:selected").text();
5
6 获取select选中的 value:
7 $("#ddlregtype ").val();
8
9 获取select选中的索引:
10 $("#ddlregtype ").get(0).selectedindex;
11
12 设置select:
13 设置select 选中的索引：
14 $("#ddlregtype ").get(0).selectedindex=index;//index为索引值
15
16 设置select 选中的value：
17 $("#ddlregtype ").attr("value","normal“);
18 $("#ddlregtype ").val("normal");
19 $("#ddlregtype ").get(0).value = value;
20
21 设置select 选中的text:
22
23 var count=$("#ddlregtype option").length;
24 for(var i=0;i<count;i++)
25 { if($("#ddlregtype ").get(0).options[i].text == text)
26 {
27 $("#ddlregtype ").get(0).options[i].selected = true;
28 break;
29 }
30 }
31 $("#select_id option[text='jquery']").attr("selected", true);
32
33 设置select option项:
34
35 $("#select_id").append("<option value='value'>text</option>"); //添加一项option
36 $("#select_id").prepend("<option value='0'>请选择</option>"); //在前面插入一项option
37 $("#select_id option:last").remove(); //删除索引值最大的option
38 $("#select_id option[index='0']").remove();//删除索引值为0的option
39 $("#select_id option[value='3']").remove(); //删除值为3的option
40 $("#select_id option[text='4']").remove(); //删除text值为4的option
41
42 清空 select:
43
44 $("#ddlregtype ").empty();
45
46 工作需要，要获得两个表单中的值。如图：
47
48 如何获得从左边选择框添加到右边选择框中的值？我想了想用网页特效可以获得，这里用了比较流行的jquery。
49 js代码如下：
50
51 //获取所有属性值 var item = $("#select1").val();
52 $(function(){
53 $('#select1').each( //获得select1的所有值
54 function(){
55 $('button').click(function(){
56 alert($('#select2').val()); //获得select2中的select1值
57 });
58 });
59 })
60 </script>
61
62 值得注意的是，不能直接写成
63
64 $(function(){
65 $('#select2').each( //获得select1的所有值，因为前面讲选项从左边添加到右边，jquery其实并没有真正将值从左边传到右边。
66 function(){
67 $('button').click(function(){
68 alert($(this).val()); //获得select2中的select1值
69 });
70 });
71 })
72
73 html：
74 <div class="centent">
75 <select multiple="multiple" id="select1" name="dd" style="100px;height:160px;">
76 <option value="1">选项1</option>
77 <option value="2">选项2</option>
78 <option value="3">选项3</option>
79 <option value="4">选项4</option>
80 <option value="5">选项5</option>
81 <option value="6">选项6</option>
82 <option value="7">选项7</option>
83 </select>
84 <div>
85 <span id="add" >选中添加到右边>></span>
86 <span id="add_all" >全部添加到右边>></span>
87 </div>
88 </div>
89 <div class="centent">
90 <select multiple="multiple" id="select2" name="sel" style=" 100px;height:160px;">
91 </select>
92 <div>
93 <span id="remove"><<选中删除到左边</span>
94 <span id="remove_all"><<全部删除到左边</span>
95 </div>
96 </div>
97
98 使用JQuery，Ajax调用动态填充Select的option选项
99
100 //绑定ClassLevel1单击事件
101 $("#ClassLevel1").change(function () {
102 var id = $("#ClassLevel1").val();
103 var level2 = $("#ClassLevel2");
104 level2.empty();
105 $("#ClassLevel3").hide();
106 $.ajax({
107 url: "./askCommon.ashx?action=getclasslevel&pid=" + id,
108 data: { "type": "ajax" },
109 datatype: "json",
110 type: "get",
111 success: function (data) {
112 var json = eval_r(data);
113 for (var ind in json) {
114 level2.append($("<option value='" + json[ind].id + "'>" + json[ind].typename + "</option>"));
115 }
116
117 }
118 });
119 })