`

select动态添加options操作

阅读更多
copy下来的 哈哈:
  1. select id="ddlResourceType" onchange="getvalue(this)" 

动态删除select中的所有options:

  1. document.getElementById("ddlResourceType").options.length=0;  

动态删除select中的某一项option:

  1. document.getElementById("ddlResourceType").options.remove(indx);   
  2. //就是这句兼容性不好,Firefox是不懂 remove 这个方法的,所以会报错了,当然也移除不了了 

动态添加select中的项option:

  1. document.getElementById("ddlResourceType").options.add(new Option(text,value)); 

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

取值方面

  1. function getvalue(obj)  
  2. {  
  3. var m=obj.options[obj.selectedIndex].value  
  4. alert(m);//获取value  
  5. var n=obj.options[obj.selectedIndex].text  
  6. alert(n);//获取文本  

后来,发现这篇文章末端的那几句话,觉得可以用dom试试,嗯,果然可行.

  1. var sObj=document.getElementById("ddlResourceType");  
  2. sObj.removeChild(sObj.options[indx]); 

这样,上面这句就做到兼容了.

其他的代码都没有问题,可以兼容.

分享到:
评论

相关推荐

    JS对select动态添加options操作[IE&FireFox兼容]

    JS对select动态添加options操作[IE&FireFox兼容]

    javascript操作Select标记中options集合

    这篇博客“javascript操作Select标记中options集合”深入探讨了如何利用JavaScript动态地管理和操作这些选项。以下是关于这个主题的一些关键知识点: 1. **DOM操作**:在JavaScript中,我们可以使用DOM(Document ...

    JS动态添加Select中的Option元素值

    我们还创建了一个数组`optionsData`来模拟动态获取的数据,然后遍历这个数组,为每个Select元素添加对应的Option。 在实际应用中,这些Option元素可能来源于用户的输入、数据库查询的结果或是其他API的调用。通过...

    js实现动态生成select中的option

    在JavaScript编程中,动态生成`select`元素中的`option`是一项常见的需求,特别是在网页交互或者数据展示时。本文将深入探讨如何使用JavaScript实现这一功能,同时结合提供的`autoSelect.html`和`autoselect.txt`...

    Webdynpro for ABAP中select option 用法

    除了上述基本步骤之外,还可以探索更多高级特性,比如动态生成Select Options、使用多种数据类型等。这些主题可以进一步深化您对Webdynpro for ABAP中Select Options的理解和应用能力。 #### 结论 在Webdynpro for ...

    Select Tag's options process

    在实际应用中,这可能涉及到更复杂的逻辑,比如遍历数据数组来生成多个选项,或者根据用户操作动态增删选项。这种动态操作对于创建响应式和交互式的Web应用至关重要。 标签“源码”提示我们可能需要深入理解...

    javascript Select标记中options操作方法集合

    javascript操作Select标记中options集合 先来看看options集合的这几个方法: options.add(option)方法向集合里添加一项option对象; options.remove(index)方法移除options集合中的指定项; options(index)或options...

    javascript_select_option_操作详解.txt

    有时我们需要根据用户的操作动态地创建 `<select>` 元素。这可以通过使用 `document.createElement()` 方法实现: ```javascript function createSelect() { var mySelect = document.createElement("select"); ...

    web dynpro alv实例(含select options)

    在这个方法中,可以通过编程逻辑来动态修改视图的内容或行为,例如初始化select options控件,设置全局选项等。 10. 使用if_wd_select_options接口 if_wd_select_options接口用于在Web Dynpro ABAP中实现select ...

    Js操作Select大全(取值、设置选中等等)

    ### Js操作Select大全知识点详解 #### 一、概述 JavaScript(简称JS)是网页开发中不可或缺的一部分,尤其在处理用户界面交互方面具有重要作用。本文档将详细介绍如何利用原生JavaScript和jQuery来操作`<select>`...

    js 动态新增改变删除select的值

    本文将详细讲解如何通过 JavaScript 动态地添加、修改和删除 `<select>` 元素中的选项。 #### 描述:Javascript 操作 select 是表单中常见的一种,删除多个 select 值时出现的问题及解决方案 在处理 `<select>` ...

    javascript options属性集合操作代码.docx

    本文将详细介绍如何使用 JavaScript 对 `<select>` 兄件中的 `<option>` 集合进行各种操作,包括获取、删除、添加新选项以及清空整个下拉列表。 #### 二、基本概念与语法 ##### 1. 获取 `<select>` 和 `<option>` ...

    js操作select相关方法

    本篇文章将详细讲解如何使用JavaScript来操作这些`select`元素,包括选择、添加、删除、获取和设置选项,以及监听事件。 ### 1. 获取Select元素 首先,我们需要获取到`select`元素。可以使用`document....

    键盘操作select下拉框

    这段代码为所有的`select`元素添加了键盘事件监听器,当按下`上箭头`和`下箭头`键时,选项会相应地向上或向下滚动。按下`Enter`键后,选中的选项会被选定,并且焦点会被移除,防止页面滚动(这一步可以根据具体需求...

    js 操作select和option

    通过 JavaScript,我们可以实现对这些元素的动态操作,包括创建、添加、删除选项等。下面将详细介绍如何使用 JavaScript 来操作 `<select>` 和 `<option>`。 #### 1. 动态创建 Select 控件 ```javascript function...

    select 控件操作大全

    使用JavaScript可以轻松地操纵这些 `<select>` 控件,从而实现动态地添加、删除、修改选项等功能。本文将详细介绍如何使用JavaScript进行 `<select>` 控件的各种操作。 #### 二、知识点详解 ##### 1. 判断 `select...

    javascript 操作表单select的常用步骤

    ### JavaScript操作表单Select元素的常用步骤 在Web开发中,`<select>`标签用于创建一...通过以上步骤,我们可以有效地使用JavaScript来操作`<select>`元素,实现动态增删改查等功能,提高Web应用的交互性和用户体验。

    Js操作Select大全.doc

    如果不存在,就创建一个新的`Option`对象,并使用`add`方法将其添加到`<select>`的`options`集合中,同时显示一个成功提示。 3. **从select中删除选项** 使用`jsRemoveItemFromSelect`函数,我们可以根据指定的`...

Global site tag (gtag.js) - Google Analytics