1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<html>
<script type="text/javascript">
var selectedValue = '<%= request.getAttribute("line")%>'
function changeSelected(){
jsSelectItemByValue(document.getElementById("mySelect"),selectedValue)
}
function jsSelectItemByValue(objSelect,objItemText) {
for(var i=0i<objSelect.options.lengthi++) {
if(objSelect.options[i].value == objItemText) {
objSelect.options[i].selected = true
break
}
}
}
</script>
<body onload="changeSelected()">
<select id="mySelect" name="mySelect">
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
</body>
</html>
1.给select命名一个id属性,比如select的id叫做ddlSelect2.给button按钮加个onclick事件,如下下
<input type="button" value="aa" onclick="document.getElementById('ddlSelect').size = document.getElementById('select').length"/>
这样可实现展开效果
提示下:该select原本在js中是没有自动展开的属性的,只能设置select标签的size属性来实现展开的效果
判断select选项中 是否存在Value="paraValue"的Item
向select选项中 加入一个Item
从select选项中 删除一个Item
删除select中选中的项
修改select选项中 value="paraValue"的text为"paraText"
设置select中text="paraText"的第一个Item为选中
设置select中value="paraValue"的Item为选中
得到select的当前选中项的value
得到select的当前选中项的text
得到select的当前选中项的Index
清空select的项
js 代码如下:
// 1.判断select选项中 是否存在Value="paraValue"的Itemfunction jsSelectIsExitItem(objSelect, objItemValue) {
var isExit = false
for (var i = 0 i < objSelect.options.length i++) {
if (objSelect.options[i].value == objItemValue) {
isExit = true
break
}
}
return isExit
}
// 2.向select选项中 加入一个Item
function jsAddItemToSelect(objSelect, objItemText, objItemValue) {
//判断是否存在
if (jsSelectIsExitItem(objSelect, objItemValue)) {
alert("该Item的Value值已经存在")
} else {
var varItem = new Option(objItemText, objItemValue)
objSelect.options.add(varItem)
alert("成功加入")
}
}
// 3.从select选项中 删除一个Item
function jsRemoveItemFromSelect(objSelect, objItemValue) {
//判断是否存在
if (jsSelectIsExitItem(objSelect, objItemValue)) {
for (var i = 0 i < objSelect.options.length i++) {
if (objSelect.options[i].value == objItemValue) {
objSelect.options.remove(i)
break
}
}
alert("成功删除")
} else {
alert("该select中 不存在该项")
}
}
// 4.删除select中选中的项
function jsRemoveSelectedItemFromSelect(objSelect) {
var length = objSelect.options.length - 1
for(var i = length i >= 0 i--){
if(objSelect[i].selected == true){
objSelect.options[i] = null
}
}
}
// 5.修改select选项中 value="paraValue"的text为"paraText"
function jsUpdateItemToSelect(objSelect, objItemText, objItemValue) {
//判断是否存在
if (jsSelectIsExitItem(objSelect, objItemValue)) {
for (var i = 0 i < objSelect.options.length i++) {
if (objSelect.options[i].value == objItemValue) {
objSelect.options[i].text = objItemText
break
}
}
alert("成功修改")
} else {
alert("该select中 不存在该项")
}
}
// 6.设置select中text="paraText"的第一个Item为选中
function jsSelectItemByValue(objSelect, objItemText) {
//判断是否存在
var isExit = false
for (var i = 0 i < objSelect.options.length i++) {
if (objSelect.options[i].text == objItemText) {
objSelect.options[i].selected = true
isExit = true
break
}
}
//Show出结果
if (isExit) {
alert("成功选中")
} else {
alert("该select中 不存在该项")
}
}
// 7.设置select中value="paraValue"的Item为选中
document.all.objSelect.value = objItemValue
// 8.得到select的当前选中项的value
var currSelectValue = document.all.objSelect.value
// 9.得到select的当前选中项的text
var currSelectText = document.all.objSelect.options[document.all.objSelect.selectedIndex].text
// 10.得到select的当前选中项的Index
var currSelectIndex = document.all.objSelect.selectedIndex
// 11.清空select的项
document.all.objSelect.options.length = 0