获取select ：
获取select 选中的 text :
?
|
1
|
$(
"#ddlregtype"
).find(
"option:selected"
).text();
|
获取select选中的 value:
?
|
1
|
$(
"#ddlregtype "
).val();
|
获取select选中的索引:
?
|
1
|
$(
"#ddlregtype "
).get(0).selectedindex;
|
设置select:
设置select 选中的索引：
?
|
1
|
$(
"#ddlregtype "
).get(0).selectedindex=index;
//index为索引值
|
设置select 选中的value：
?
|
1
2
3
|
$(
"#ddlregtype "
).attr(
"value"
,
"normal“);
$("
#ddlregtype ").val("normal");
$("
#ddlregtype ").get(0).value = value;
|
设置select 选中的text:
?
|
1
2
3
4
5
6
7
8
9
|
var
count=$(
"#ddlregtype option"
).length;
for
(
var
i=0;i<count;i++)
{
if
($(
"#ddlregtype "
).get(0).options[i].text == text)
{
$(
"#ddlregtype "
).get(0).options[i].selected =
true
;
break
;
}
}
$(
"#select_id option[text='jquery']"
).attr(
"selected"
,
true
);
|
设置select option项:
?
|
1
2
3
4
5
6
|
$(
"#select_id"
).append(
"<option value='value'>text</option>"
);
//添加一项option
$(
"#select_id"
).prepend(
"<option value='0'>请选择</option>"
);
//在前面插入一项option
$(
"#select_id option:last"
).remove();
//删除索引值最大的option
$(
"#select_id option[index='0']"
).remove();
//删除索引值为0的option
$(
"#select_id option[value='3']"
).remove();
//删除值为3的option
$(
"#select_id option[text='4']"
).remove();
//删除text值为4的option
|
清空 select:
?
|
1
|
$(
"#ddlregtype "
).empty();
|
工作需要，要获得两个表单中的值。如图：
如何获得从左边选择框添加到右边选择框中的值？我想了想用网页特效可以获得，这里用了比较流行的jquery。
js代码如下：
?
|
1
2
3
4
5
6
7
8
9
10
|
//获取所有属性值 var item = $("#select1").val();
$(
function
(){
$(
'#select1'
).each(
//获得select1的所有值
function
(){
$(
'button'
).click(
function
(){
alert($(
'#select2'
).val());
//获得select2中的select1值
});
});
})
</script>
|
值得注意的是，不能直接写成
?
|
1
2
3
4
5
6
7
8
|
$(
function
(){
$(
'#select2'
).each(
//获得select1的所有值，因为前面讲选项从左边添加到右边，jquery其实并没有真正将值从左边传到右边。
function
(){
$(
'button'
).click(
function
(){
alert($(
this
).val());
//获得select2中的select1值
});
});
})
|
html：
?
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
|
<
div
class
=
"centent"
>
<
select
multiple
=
"multiple"
id
=
"select1"
name
=
"dd"
style
=
"width:100px;height:160px;"
>
<
option
value
=
"1"
>选项1</
option
>
<
option
value
=
"2"
>选项2</
option
>
<
option
value
=
"3"
>选项3</
option
>
<
option
value
=
"4"
>选项4</
option
>
<
option
value
=
"5"
>选项5</
option
>
<
option
value
=
"6"
>选项6</
option
>
<
option
value
=
"7"
>选项7</
option
>
</
select
>
<
div
>
<
span
id
=
"add"
>选中添加到右边>></
span
>
<
span
id
=
"add_all"
>全部添加到右边>></
span
>
</
div
>
</
div
>
<
div
class
=
"centent"
>
<
select
multiple
=
"multiple"
id
=
"select2"
name
=
"sel"
style
=
"width: 100px;height:160px;"
>
</
select
>
<
div
>
<
span
id
=
"remove"
><<选中删除到左边</
span
>
<
span
id
=
"remove_all"
><<全部删除到左边</
span
>
</
div
>
</
div
>
|
使用JQuery，Ajax调用动态填充Select的option选项
?
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
//绑定ClassLevel1单击事件
$(
"#ClassLevel1"
).change(
function
() {
var
id = $(
"#ClassLevel1"
).val();
var
level2 = $(
"#ClassLevel2"
);
level2.empty();
$(
"#ClassLevel3"
).hide();
$.ajax({
url:
"./askCommon.ashx?action=getclasslevel&pid="
+ id,
data: {
"type"
:
"ajax"
},
datatype:
"json"
,
type:
"get"
,
success:
function
(data) {
var
json = eval_r(data);
for
(
var
ind
in
json) {
level2.append($(
"<option value='"
+ json[ind].id +
"'>"
+ json[ind].typename +
"</option>"
));
}
}
});
})
|