`
zyongsheng83
  • 浏览: 43292 次
  • 性别: Icon_minigender_1
  • 来自: 大连
最近访客 更多访客>>
社区版块
存档分类
最新评论

向select里添加项并设置选中时的问题

 
阅读更多

假设有:
<select name="sname">
  <option value="1">class 1</option>
  <option value="2" selected>class 2</option>
</select>

执行:
var opt = document.createElement("option");
opt.value="3";
opt.innerHTML="class 3";
document.getElementById("sname").appendChild(opt);
document.getElementById("sname").selectedIndex=2;
//这样并不能选中第三项,只有新加的项会出现这种情况

解决:
在document.sname.selectedIndex=2;之前调用一下document.getElementById("sname").focus();
或者setTimeout(0, new Function("document.getElementById('sname').selectedIndex=2;")); 

分享到:
评论

相关推荐

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

    本文档将详细介绍如何利用原生JavaScript和jQuery来操作`&lt;select&gt;`元素,包括但不限于取值、设置选中状态等常见操作。 #### 二、基础知识回顾 在开始深入讲解之前,我们先回顾一下`&lt;select&gt;`的基本结构: ```html ...

    js动态设置select下拉菜单的默认选中项实例

    在select元素中,我们使用option元素来定义下拉列表的每一项,并为其中的一项设置selected属性,使其成为初始选中的项。比如,在这段代码中,value="2"的option被默认选中。 ```html &lt;select name="select" id=...

    struts2实现页面select标签默认选中

    Struts2提供了一个非常强大的标签——`&lt;s:select&gt;`,它可以用来生成一个`&lt;select&gt;`下拉列表,并支持动态设置默认选中项。 #### 代码示例 假设我们需要根据用户提交的`auditingLog`对象中的`auditingState`属性值来...

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

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

    ExtJs 实现select列表选中项时添加删除

    标题中的"ExtJs 实现select列表选中项时添加删除"指的是在ExtJS应用中创建一个下拉选择列表(Select List),并且当用户选择某一项时,能够执行添加或删除操作。这通常涉及到事件监听、数据模型的操作以及用户界面的...

    jquery select 选中值设置左右select选择互换

    当任一select的选中值改变时,它会将当前选中值传递到另一个select,并清除自身的选中状态。这样,用户在任一侧选择一个值后,该值会立即被交换到另一侧,同时自身清空。 在实际应用中,你可能需要根据业务需求进行...

    解决element-ui里的下拉多选框 el-select 时,默认值不可删除问题

    在使用element-ui开发Web项目时,经常会遇到一些组件使用上的细节问题,其中element-ui中的下拉多选框组件el-select使用时,如何设置默认值且不可删除,是一个较为常见的需求。本文将详细介绍如何解决这个问题,以及...

    使select可以输入

    对原来的select的操作完全没有改变,取值依然是取select的值,设置选中,添加项删除项等等都没有改变。用脚本动态设置select的值时请在后面加上一个change()这样显示的值才会改变。不知道怎么监控脚本对select的值的...

    html js 清除select里的值,js控制select增删改,选中,清空, 判断控件是否存在

    - 设置选中值:假设要选中`value="option2"`的项,可以这样操作:`document.getElementById('mySelect').selectedIndex = 1;`(数组索引从0开始)。 3. **添加和删除选项**: - 添加选项:使用`&lt;select&gt;`元素的`...

    layui问题之模拟select点击事件的实例讲解

    在Web开发中,模拟select元素的点击事件是一项常见的需求,尤其是当我们希望在不直接与页面交互的情况下改变选项值时。本文将通过实例讲解来阐述如何在使用layui框架的情况下,模拟select的点击事件。 ### 标题知识...

    jquery操作select详解(取值,设置选中)

    1. **设置value为pxx的项选中** 当你需要将某个选项设为选中状态,且该选项的`value`属性为`pxx`时,可以使用`val()`方法。例如: ```javascript $('.selector').val('pxx'); ``` 这行代码会查找所有class为`...

    option的value比较来确定select默认选中项

    下面将详细介绍如何通过`option的value`比较来确定`select`的默认选中项,并结合HTML和JavaScript的相关知识进行深入探讨。 1. HTML基础 在HTML中,`&lt;select&gt;`元素创建一个下拉列表,通过`&lt;option&gt;`标签添加选项。...

    vue中select的使用以及select设置默认选中.docx

    在Vue.js中,`&lt;select&gt;`元素的使用和设置默认选中是一个常见的需求,尤其是在处理表单和数据绑定时。...遵循这些步骤,你就能确保在Vue中正确地使用`&lt;select&gt;`并设置默认选中项,避免遇到页面加载后下拉框为空的情况。

    jQuery获取Select选择的Text和_Value

    可以使用 `$("#select_id option[text='jQuery']").attr("selected", true)` 方法设置 Select 的 Text 值为 jQuery 的项选中。 三、 jQuery 添加/删除 Select 的 Option 项 jQuery 也提供了方法来添加或删除 ...

    LayUI下拉多选添加选中事件.zip

    标题“LayUI下拉多选添加选中事件”暗示我们要讨论的是如何在LayUI的下拉多选框中实现选中项的事件处理。在LayUI中,下拉多选通常使用`layui-select`样式和`layui-form-checkbox`类来创建,同时配合JavaScript进行...

    jQuery模拟Select下拉菜单选中添加代码.zip

    《jQuery模拟Select下拉菜单选中添加代码》 在网页开发中,Select下拉菜单是一种常见的用户交互元素,用于提供多个选项供用户选择。然而,原生的HTML Select标签有时不能满足设计师和开发者对于界面美观性和交互性...

    layui第三方插件xm-select

    同时,它还提供了一些操作方法,如`setSelected`用于设置选中项,`reset`用于重置选择状态,`getSelected`用于获取当前选中的选项等。 4. **事件监听**:可以监听`xm-select`的各种事件,如`change`事件,当用户...

    js 加载select 项

    首先,我们来看一下如何用JavaScript动态地向`select`元素添加选项。这通常涉及以下几个步骤: 1. 获取`select`元素:通过`document.getElementById`或`document.querySelector`等方法获取`select`元素的引用。 ```...

    多个select 的互斥选择实现

    当`select`的值发生变化时,会遍历所有`select`并取消其他`select`的选中状态,从而实现了互斥选择。 如果你有多个`select`元素,只需将它们的ID添加到`querySelectorAll`的参数列表中即可。同时,需要注意的是,这...

    select项内容过长解决办法

    然而,当`&lt;select&gt;`列表中的选项内容过长时,可能会出现一些问题,比如显示不全或者遮挡其他内容。针对这个问题,我们可以采取以下策略来优化和解决: 1. **设置固定宽度**:你可以为`&lt;select&gt;`元素设置一个固定的...

Global site tag (gtag.js) - Google Analytics