JS对select动态添加options操作

<select id="ddlResourceType" οnchange="getvalue(this)">
</select>

    动态删除select中的所有options: 
       document.getElementById("ddlResourceType").options.length=0; 

     动态删除select中的某一项option: 
       document.getElementById("ddlResourceType").options.remove(indx);  

     动态添加select中的项option: 
       document.getElementById("ddlResourceType").options.add(new Option(text,value)); 

     上面在IE和FireFox都能测试成功,希望以后你可以用上。 
其实用标准的DOM操作也可以,就是document.createElement,appendChild,removeChild之类的。 

取值方面
    function getvalue(obj)
    {
        var m=obj.options[obj.selectedIndex].value
        alert(m);//获取value
        var n=obj.options[obj.selectedIndex].text
        alert(n);//获取文本
    }

==============================================================================
1 检测是否有选中 
if (objSelect.selectedIndex > - 1 ) { 
// 说明选中 
} else { 
// 说明没有选中 


2 删除被选中的项 
objSelect.options[objSelect.selectedIndex] = null ; 

3 增加项 
objSelect.options[objSelect.length] = new Option( " 你好 " , " hello " ); 

4 修改所选择中的项 
objSelect.options[objSelect.selectedIndex] = new Option( " 你好 " , " hello " ); 

5 得到所选择项的文本 
objSelect.options[objSelect.selectedIndex].text; 

6 得到所选择项的值 
objSelect.options[objSelect.selectedIndex].value;

 

总结:document.getElementById("元素ID")与jquery中的$("#元素ID")是不等同的,应该用$("#元素ID").get(0)。 get()方法为取得所有匹配的 DOM(document) 元素集合。可用以下方法测试:

<div id="SAL"></div>

alert($("#SAL"));  弹出对话框内容为[object,Object]

alert($("#SAL").get(0));  弹出对话框内容为[object,HTMLDivElement]

alert(document.getElementById("SAL"));  弹出对话框内容为[object,HTMLDivElement]

注意:请在FireFox浏览器下进行测式,否则看不到这些变化!

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: 这个问题是关于JavaScript中添加表单下拉框选项(option)的。 在JavaScript中,可以通过以下代码动态地向表单下拉框添加选项: ``` var select = document.getElementById("mySelect"); // 获取下拉框元素 var option = document.createElement("option"); // 创建一个<option>元素 option.text = "选项文本"; // 设置选项文本 option.value = "选项值"; // 设置选项值(可选) select.add(option); // 把选项添加到下拉框中 ``` 其中,`mySelect`是要添加选项的下拉框元素的ID,可以根据实际情况修改。 希望对您有所帮助! ### 回答2: 在JavaScript中,我们可以通过select元素的options属性来访问它的选项。此属性返回表示选项列表的HTMLCollection对象。我们可以使用appendChild()方法将动态创建的新option元素添加到选项列表末尾或insertBefore()方法将其插入到选项列表中的指定位置。但要注意的是,我们必须先创建一个新的option元素,再把它添加select元素的options集合中。下面是一些示例代码: 1. 在select元素末尾添加新的option ```javascript var select = document.getElementById("mySelect"); var option = document.createElement("option"); option.text = "新的选项"; select.options.add(option); ``` 2. 在select元素中指定位置添加新的option ```javascript var select = document.getElementById("mySelect"); var option = document.createElement("option"); option.text = "新的选项"; // 将新的option插入到select元素的第二个位置 select.options.add(option, 1); ``` 除了使用appendChild()方法和insertBefore()方法添加新的option元素外,我们还可以设置新option元素的属性,如value、selected和disabled等。请注意,有些浏览器可能无法正确处理动态创建的select选项,在这种情况下,我们可以使用innerHTML属性更改整个选项列表的HTML代码。但是,这种方法可能会破坏与选项列表相关联的JavaScript代码,因此请谨慎使用。 ### 回答3: JavaScript 的 select 元素提供了一种很方便的方式来创建下拉菜单。通常情况下,select 里面的 option 对象是通过静态的方式创建的,即在 HTML 中手工编写。 但是,在某些情况下,我们需要通过 JavaScript 动态添加 option 对象来实现更加复杂的操作。这时可以通过代码中的 add 方法来实现。 添加 select option 方法: 首先,我们需要调用 select 元素的 options 属性,获取 select 对象的 option 集合。options 属性是一个数组,包含了当前 select 元素中所有 option 对象,可以通过数组下标的方式访问每个 option 对象。 其次,我们需要创建一个 option 对象,并设置 option 对象的 value 和 text 属性。value 属性表示该 option 对象的值,text 属性表示该 option 对象在下拉菜单中的显示文本。 最后,我们将创建的 option 对象添加select 元素的 options 集合中,即可完成动态添加 option 对象的操作。 代码如下: ``` <script type="text/javascript"> //获取 select 对象 var selectObj = document.getElementById("selectId"); //创建一个 option 对象 var optionObj = document.createElement("option"); //设置 option 对象的 value 和 text 属性 optionObj.value = "value1"; optionObj.text = "Option 1"; //将 option 对象添加select 对象的 options 集合中 selectObj.options.add(optionObj); </script> ``` 这样,我们就可以通过 JavaScript 动态添加 selectoption 对象了。在实际的应用场景中,我们可以根据具体的需求,修改代码逻辑,实现更加丰富的操作

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值