正文

Javascript 操作select控件大全(新增、修改、删除、选中、清空、判2012-06-17 17:53:00

【评论】 【打印】 【字体: 】 本文链接:http://blog.pfan.cn/edwardguo/53524.html

分享到:

  Javascript 操作select控件大全(新增、修改、删除、选中、清空、判断存在等) 1判断select选项中 是否存在Value="paraValue"的Item 2向select选项中 加入一个Item 3从select选项中 删除一个Item 4删除select中选中的项 5修改select选项中 value="paraValue"的text为"paraText" 6设置select中text="paraText"的第一个Item为选中 7设置select中value="paraValue"的Item为选中 8得到select的当前选中项的value 9得到select的当前选中项的text 10得到select的当前选中项的Index 11清空select的项 js 代码 // 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;        }            // 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;     ---------------------------------------------------------------------------------------------------------------------------------------------- <script type="text/javascript">     function FillYearSelect() {         {             var control = document.getElementById("Year");             if (control != null) {                 var date = new Date();                 var thisYear = date.getFullYear();                 var i = 2008;                 for (var i = 2008; i <= thisYear; i++) {                     if (!OptionIsExist(control, i))                     {                         alert(i);                         var item = new Option(i, i);                         control.options.add(item);                     }                 }             }         }     }        function OptionIsExist(objSelect, objValue)     {         var exist = false;         for (var i = 0; i <objSelect.options.length; i++)         {             if (objSelect.options[i].value == objValue)             {                 exist = true;                 break;             }          }          return exist;      }       </script>  

阅读(2656) | 评论(0)


版权声明:编程爱好者网站为此博客服务提供商,如本文牵涉到版权问题,编程爱好者网站不承担相关责任,如有版权问题请直接与本文作者联系解决。谢谢!

评论

暂无评论
您需要登录后才能评论,请 登录 或者 注册