`
wdhdd889
  • 浏览: 151827 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

js 操作select option

阅读更多

<select id="ddlResourceType" onchange="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浏览器下进行测式,否则看不到这些变化!

分享到:
评论

相关推荐

    js 操作select和option

    &lt;title&gt;JS 操作 Select 和 Option &lt;script language="JavaScript"&gt; function $(id) { return document.getElementById(id); } function show() { var selectObj = $("area"); var myOption = document....

    js实现动态生成select中的option

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

    select option带自定义图片

    总结来说,要实现`&lt;select&gt;`和`&lt;option&gt;`带有自定义图片的效果,我们需要结合HTML的`data-*`属性,JavaScript的动态操作和CSS的样式设计。这不仅增强了用户体验,也展示了前端技术在实现视觉效果方面的灵活性。在...

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

    在JavaScript(JS)编程中,动态添加Select中的Option元素值是一项常见的需求,特别是在网页交互或者数据填充时。这里我们将深入探讨如何实现这个功能,并提供一个实际的案例来演示这一过程。 首先,我们要理解HTML...

    Javascript操作Select和Option

    Javascript操作Select和Option 一个网页 挺全的

    javascript_select_option_操作详解.txt

    ### JavaScript Select Option 操作详解 #### 一、检测是否有选中项 在处理表单时,经常需要检测用户是否已选择了某个 `&lt;select&gt;` 元素中的 `&lt;option&gt;` 项。以下是一个简单的示例来实现这一功能: ```javascript ...

    Jquery操作Select option整理

    ### jQuery 操作 Select Option 整理 #### 一、引言 在Web开发中,`&lt;select&gt;`元素作为用户交互的重要部分,常用于提供一系列选项供用户选择。jQuery作为一种流行的JavaScript库,极大地简化了DOM操作的过程,使得...

    jquery获得select option值

    var item = $("select[@name=items] option:selected").text(); ``` 这里使用了`option:selected`选择器来选取当前被选中的`&lt;option&gt;`元素,并通过`.text()`获取其文本内容。 2. **设置默认选中的下拉项**: ``...

    js select option

    首先,让我们了解JavaScript原生的方法来操作`select`和`option`。通过`document.getElementById('id')`或`document.querySelector('#id')`,你可以获取到对应的`select`元素。一旦有了引用,就可以使用`.options`...

    select通过js删除指定的option选项

    简单的例子,点击按钮就删除掉option,也可以通过jquery加载的时候进行删除。

    js操作option,js添加删除option,js判断option中的value是否存在,简洁

    用js操作select的option,可以增加删除和判断value值是否在下拉列表存在

    javascript 获取select ->option中id、value、label属性及中内容

    javascript 获取select -&gt;option中id、value、label属性及&lt;option&gt;&lt;/option&gt;中内容

    JS动态添加option和删除option(附实例代码)

    1.动态创建select 代码如下: function createSelect(){ var mySelect = document.createElement(“select”); mySelect.id = “mySelect”; document.body.appendChild(mySelect); } 2.添加选项option 代码如下: ...

    select option,鼠标移到哪个选向就给出相应的鼠标提示

    JavaScript可以监听鼠标的移动事件,当鼠标移动到&lt;select&gt;的某个&lt;option&gt;上时,触发显示提示信息的代码。CSS则用于定制提示信息的样式,如颜色、位置、字体等,使其与整体界面风格保持一致。 例如,以下是一个简单...

    JS更改select内option属性的方法

    本文详细介绍了如何使用JavaScript更改select元素内option的属性,包括更改选项文本、值等,并提供了一个实例来演示具体操作。 首先,要更改select内的option属性,需要获取select元素的DOM引用。这通常通过...

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

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

    js操作select控件大全

    js 操作 select 控件大全是 JavaScript 中对 select 控件的各种操作的集合,包括新增、修改、删除、选中、清空、判断存在等多种操作。下面将对这些操作进行详细的介绍和讲解。 一、 判断 select 选项中是否存在 ...

    select将选中的option设置为默认选项

    总之,通过JavaScript操作DOM,我们可以方便地在网页上动态设置`&lt;select&gt;`元素的默认选中项。这个功能在许多交互式应用场景中非常有用,比如用户配置、数据筛选等。在实际项目中,还可以结合事件监听器,如`change`...

    自定义带图标的select,只需把图标地址写在option的title属性中即可

    这个JS插件就是为了解决这个问题,它扩展了`&lt;select&gt;`的功能,允许我们在`&lt;option&gt;`的`title`属性中插入图标地址,然后在界面上动态渲染这些图标。 接下来,我们要探讨如何使用这个插件。在项目中,首先需要引入...

Global site tag (gtag.js) - Google Analytics