<select id="selectobj"></select>
1.取select的对象方法
①中情况:
如果有from的情况下可以这样取到 select 的对象
var objSelect = document.forms[0].elements["selectobj"];
score代表selectobj的id的名称
②中情况:
就是最常用的用id的方式取得
var objSelect = document.getElementById("selectobj");
2. js动态创建 option 有两种情况
①中情况:
var objSelect = document.getElementById("selectobj");
for(i=0;i<5;i++)
{
var varItem = new Option("zuo"+i, i);
objSelect.options.add(varItem);
}
②中情况:
for(j=0;j<5;j++)
{
var option_obj = document.createElement("OPTION");
option_obj.value = j;
option_obj.text = "shaobiao"+j;
objSelect.add(option_obj);
}
3. js动态显示其中的 option的值
①中情况:
objSelect.options[i].selected=true;
i 代表显示值的selectedIndex当你初始化的时候你想叫那个option的值显示
②中情况:
objSelect.options[i].selected=“select”;
4.js 动态移除 option的相应的值
下边的这两种情况都是可以的 你自己喜欢那个你自己选吧
①中情况:
核心语句:objSelect.options.remove(i);
i 代表显示值的selectedIndex当你初始化的时候你想叫那个option的值显示
function removeOptions(){
var opts = document.getElementById("selectobj");
for(var i=opts.length-1;i>=0;i--){
if(opts.options[i].selected==true){
opts.options.remove(i);
}
}
}
②中情况:
核心语句: opts.options[i]=null;
function removeOptions(){
var opts = document.getElementById("selectobj");
for(var i=opts.length-1;i>=0;i--){
if(opts.options[i].selected==true){
opts.options[i]=null;
}
}
}
5. 还有就是多选select时候。在这种情况先一般是在做人员权限的时候用的。
<select size="6" id="selectobj" multiple="multiple" > </select>
红色的就是select多选的一个属性
6. 如果你想全部清空select所有的值 你可以直接用
objSelect.options.length = 0;
7.设置select中value="paraValue"的Item为选中
document.all.selectobj.value = objItemValue;
8.得到select的当前选中项的value
var SValue = document.all.selectobj.value;
9.得到select的当前选中项的text
var SText = document.all.selectobj.options
[document.all.selectobj.selectedIndex].text;
10.得到select的当前选中项的Index
var SIndex= document.all.selectobj.selectedIndex;
呵呵这些就足够你去操作select标签了吧
如果喜欢讨论技术的可以加我 QQ :307495178
MSN: lorebody2008@hotmail.com
分享到:
相关推荐
在JavaScript中,`<select>`元素是用来创建下拉列表的,而`<option>`标签则用于定义下拉列表中的选项。这篇博客“javascript操作Select标记中options集合”深入探讨了如何利用JavaScript动态地管理和操作这些选项。...
JavaScript中的Select对象是HTML表单元素Select的编程接口,它提供了对下拉列表的操作功能。在Web开发中,Select元素通常用于创建用户可以选择的多个选项。以下是对标题和描述中涉及的知识点的详细说明: 1. **动态...
### JavaScript模拟select控件知识点详解 #### 一、引言 在前端开发中,有时我们需要对浏览器原生的`<select>`元素进行定制化处理,比如实现更丰富的样式或者增加额外的功能。本篇将深入探讨如何使用纯JavaScript...
### JavaScript Select Option 操作详解 #### 一、检测是否有选中项 在处理表单时,经常需要检测用户是否已选择了某个 `<select>` 元素中的 `<option>` 项。以下是一个简单的示例来实现这一功能: ```javascript ...
JavaScript selectJavaScript selectJavaScript selectJavaScript selectJavaScript selectJavaScript selectJavaScript selectJavaScript selectJavaScript selectJavaScript selectJavaScript selectJavaScript ...
本文将深入探讨如何使用JavaScript来操作Select及其内部的Option。 1. **动态创建 Select** 使用`document.createElement("select")`可以创建一个新的`<select>`元素。接着通过`id`属性设置其唯一标识,并用`...
下面详细说明与“JavaScript select 改变字的颜色”相关的知识点。 首先,要改变select元素选项的字体颜色,通常我们会使用JavaScript来操作DOM(文档对象模型),从而动态地为select的option元素添加或修改CSS样式...
### JavaScript Select 之间传值效果的代码解析 #### 核心知识点:JavaScript 与 HTML Select 元素交互 本文将详细介绍一个示例代码,该代码实现了两个`<select>`元素之间的值传递。当用户在第一个下拉列表中选择...
在JavaScript中,`<select>`元素的`options`属性是一个选项列表,用于存储`<option>`元素。在处理用户界面时,有时我们需要根据特定规则对这些选项进行排序,例如按字母顺序排列。在这个场景中,"javascript select ...
JavaScript Select和Option列表元素上下左右移动 在这个资源中,我们将要讨论如何使用 JavaScript 实现 Select 和 Option 列表元素的上下左右移动功能。这个功能支持一次选中多项在左右列表中来回移动,非常适合在...
这个压缩包“Select Multiple Values from Combobox Using JavaScript.zip”很可能包含了一个简单的示例,演示如何使用JavaScript来实现多选下拉列表的功能。在网页中,这种功能通常通过HTML的`<select>`元素配合`...
### JavaScript操作select大全 在网页开发中,`<select>`元素是用于创建下拉列表的常用HTML标签之一。本文档提供了详细的JavaScript操作`<select>`元素的方法,包括判断选项是否被选中、增删改选项及其属性等实用...
`JSelect`是一个JavaScript库,它提供了自定义样式和增强功能,使得`select`元素看起来更加美观并具有更好的用户体验。本文将深入探讨如何使用`js`加载`select`项,并介绍`JSelect`库的使用方法。 首先,我们来看...
### JavaScript Select列表内容按字母倒序排序与按列表倒序排列 #### 背景介绍 在日常的前端开发工作中,经常会遇到对`<select>`元素中的选项进行操作的需求,例如按照某种规则重新排序。本篇文章主要介绍了如何...
JavaScript Select2 是一个高度可定制且功能丰富的选择框插件,它是针对原生HTML `<select>` 元素的增强工具,特别适用于处理大型数据集或需要实现搜索功能的情况。Select2 支持从本地数据源或者远程API动态加载数据...
双向选择的js代码,经常使用的select双向选择和删除
总结,`select`元素在JavaScript中是不可或缺的一部分,尤其在表单提交和用户交互场景中。通过熟练掌握它的用法和相关事件处理,可以构建更丰富、更具有交互性的网页应用。希望这个详解能帮助你理解和运用`select`...