软件之家JavaScript操作select元素和option的实例代码_javascript技巧_脚本之家

软件之家 ,以上所述是小编给大家分享的JavaScript操作select元素和option的实例代码,希望对大家有所帮助。

$ {createSelect;addOption("addSel", "first", "第一个数据");addOption("addSel", "secord", "第二个数据");addOption("addSel", "three", "第三个数据");addOption("addSel", "four", "第四个数据");addOption("addSel", "fives", "第五个数据");removeOneByIndex;removeOneByObj;//添加一个option更改事件 调用自己写的方法$.change {alert("旧文本:"+getOptionText + "旧Value:" + getOptionValue;editOptions("addSel", "新文本","新Value"); //注意:不传value值的时候 value值默认为text的值alert("新文本:" + getOptionText + "新Value:" + getOptionValue//动态创建带id的元素function createSelect {var select = document.createElement;select.id = id;document.body.appendChild;}//根据select的id 添加选项optionfunction addOption {//根据id查找对象, var obj = document.getElementById; obj.options.add(new Option; //这个兼容IE与firefox }//删除所有选项optionfunction removeAll {var obj = document.getElementById;obj.options.length = ;}//根据 index 值删除一个选项optionfunction removeOneByIndex {var obj = document.getElementById;//index,要删除选项的序号,这里取当前选中选项的序号 //var index = obj.selectedIndex;//获取选中的选项的index;obj.options.remove;}//根据 value或者text值删除一个选项optionfunction removeOneByObj(selectID, textOrValue) {var obj = document.getElementById;//index,要删除选项的序号,这里取当前选中选项的序号 //var index = obj.selectedIndex;//获取选中的选项的index;for (var i = ; i < obj.options.length; i++) {if (obj.options[i].innerHTML == textOrValue || obj.options[i].value == textOrValue) {obj.options.remove;break;}}} //获得一个Option Value;function getOptionValue{var obj = document.getElementById; var index=obj.selectedIndex; //序号,取当前选中选项的序号 var val = obj.options[index].value;return val;} //获得一个option Text;function getOptionText {var obj = document.getElementById; var index=obj.selectedIndex; //序号,取当前选中选项的序号 var val = obj.options[index].text;return val;}//修改选中的optionfunction editOptions(selectID,newText,newValue) {var obj = document.getElementById; var index=obj.selectedIndex; //序号,取当前选中选项的序号 obj.options[index] = new Option;obj.options[index].selected = true;}//删除selectfunction removeSelect(){var select = document.getElementById; select.parentNode.removeChild; }

废话不多说了,直接给大家贴代码,具体代码如下所示:

相关文章

发表评论