html js 清除select里的值,js控制select增删改,选中,清空, 判断控件是否存在

来源：互联网发布：阿里妈妈淘宝联盟登陆编辑：程序博客网时间：2024/05/04 01:31

清空select的项
// document.all.objSelect.options.length = 0;

如果留下第一行的话就是
// document.all.objSelect.options.length = 1;

判断select选项中是否存在Value="paraValue"的Item
function 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;
}

向select选项中加入一个Item
function jsAddItemToSelect(objSelect,objItemText,objItemValue)
{
     //判断是否存在
     if(jsSelectIsExitItem(objSelect,objItemValue))
     {
         alert("该Item的Value值已经存在");
     }
     else
     {
         var varItem = new Option(objItemText,objItemValue);
//       objSelect.options[objSelect.options.length] = varItem;
         objSelect.options.add(varItem);
         alert("成功加入");
     }
}

从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中不存在该项");
     }
}

修改select选项中 value="paraValue"的text为"paraText"

设置select中text="paraText"的第一个Item为选中

设置select中value="paraValue"的Item为选中
//document.all.objSelect.value = objItemValue;

得到select的当前选中项的value
//var currSelectValue = document.all.objSelect.value;

得到select的当前选中项的text
//var currSelectIndex = document.all.objSelect.selectedIndex;

完整例子如下:
<!doctype html public "-//w3c//dtd html 4.0 transitional//en">
<html>
<head>
<title>js控制select增删改,选中,清空, 判断控件是否存在</title>
<meta name="keywords" content="javascript select options text value add modify delete set">
<meta name="description" content="javascript select options text value add modify delete set">
<script language="javascript">

</script>
</head>
<body>
<form name="watch" method="post" action="">
<select id="MySelect" name="keywords" size="10" onchange="watch_sel(this.form)"></select><br>
<script language="javascript">

</script>
<input type="text" name="word" /><br />
<input type="button" value="增加" onclick="watch_add(this.form);" />
<input type="button" value="修改" onclick="watch_mod(this.form);" />
<input type="button" value="删除" onclick="watch_del(this.form);" />
<input type="button" value="保存" onclick="watch_set(this.form);" />
</form>
</body>
</html>