- 浏览: 1493286 次
- 性别:
- 来自: 大连
文章分类
- 全部博客 (460)
- java (148)
- javascript (34)
- Flex文章 (4)
- css+div (2)
- ajax (6)
- extjs (11)
- 人生感悟 (9)
- struts2.0 (6)
- IT之路,生活 (15)
- hibernate (6)
- struts1 (1)
- spring (5)
- j2ee错误 (3)
- Dwr (5)
- Linux (33)
- C++ (3)
- SWT Win32 (2)
- EJB (1)
- JPA (4)
- C语言和LinuxC (7)
- SQL (13)
- 项目经理 (6)
- db2 (2)
- java数据结构 (2)
- 网页播放器flv (1)
- 数据库 (24)
- 用户体验设计学习 (2)
- 网络电话 (5)
- 军事理论 (4)
- android (3)
- oracle (18)
- oracle ebs form (11)
- oracle ebs oaf (4)
- erp (20)
- DBA (9)
- java中URL 的编码和解码函数 (1)
- 铁血丹心 (1)
- excel 单元格格式不能立即生效 (1)
- Java调用bat文件 (1)
- 如何把本地outlook中的邮件上传到网络邮箱中 (1)
- java 报表 打印 (1)
- 创建dblink (1)
- 图标前台框架 (1)
- vnc (1)
- FORM (1)
- MYSQL (1)
最新评论
-
July01:
推荐用StratoIO打印控件,支持网页、URL、图片、PD、 ...
web打印不显示页眉页脚 -
July01:
推荐用StratoIO打印控件,浏览器和系统的兼容性都很好,而 ...
Javascript网页打印大全 -
hardyer:
大哥写的很实在,受教了,提前祝你元旦快乐!
黎活明给程序员的忠告 -
cxysilahi:
请问WIN7 64位,调用报错Exception in thr ...
JNative的初步使用 -
action1949:
好东西,解决问题
JFreeChart乱码解决方法
1 检测是否有选中
if(objSelect.selectedIndex > -1) {
//说明选中
} else {
//说明没有选中
}
2.动态创建select
function createSelect(){
var mySelect = document.createElement_x("select");
mySelect.id = "mySelect";
document.body.appendChild(mySelect);
}
3.添加选项option
function addOption(){
//根据id查找对象,
var obj=document.getElementById('mySelect');
//添加一个选项
obj.add(new Option("文本","值"));
}
4.删除所有选项option
function removeAll(){
var obj=document.getElementById('mySelect');
obj.options.length=0;
}
5.删除一个选项option
function removeOne(){
var obj=document.getElementById('mySelect');
//index,要删除选项的序号,这里取当前选中选项的序号
var index=obj.selectedIndex;
obj.options.remove(index);
}
6.获得选项option的值
var obj=document.getElementById('mySelect');
var index=obj.selectedIndex; //序号,取当前选中选项的序号
var val = obj.options[index].value;
7.获得选项option的文本
var obj=document.getElementById('mySelect');
var index=obj.selectedIndex; //序号,取当前选中选项的序号
var val = obj.options[index].text;
8.修改选项option
var obj=document.getElementById('mySelect');
var index=obj.selectedIndex; //序号,取当前选中选项的序号
var val = obj.options[index]=new Option("新文本","新值");
9.删除select
function removeSelect(){
var mySelect = document.getElementById("mySelect");
mySelect.parentNode.removeChild(mySelect);
}
javascript select option对象
一、基础理解:
var e = document.getElementById("selectId");
e.options = new Option("文本", "值"); //创建一个option对象,即在<select>标签中创建一个或多个<option value="值">文本</option>。options是一个数组,里面可存放多个<option value="值">文本</option>标签。
1、options数组的属性:
length -------长度属性
selectedIndex ------ 当前被选中的文本的索引值,此索引值是内存自动分配的(0,1,2,3....)对应(第一个文本值,第二个文本值,第三个文本值,第四个文本值.......)
2、单个option的属性(即obj.options[obj.selectedIndex]是指定的某个<option>标签):
text ===== 返回/指定文本
value =====返回/指定文本,与<option value="...">一致
index ======返回下标
selected======返回/指定该对象是否被选中,指定true or false可动态改变选中项
defaultSelected =====返回该对象默认是否被选中,true/false
3、option的方法:
增加一个<option>标签======obj.options.add(new("文本", "值"))
删除一个<option>标签======obj.options.remove(obj.selectedIndex);
获取一个<option>标签======obj.options[obj.selectedIndex].text ;
修改一个<option>标签======obj.options[obj.selectedIndex] = new Option("新文本", "值") ;
删除所有<option>标签======obj.options.length = 0 ;
获取一个<option>标签的值====obj.options[obj.selectedIndex].value ;
注意:
obj.option中的option不需要大写
new Option中的option需要大写
二、示例:
<html>
<head>
<script language="javascript">
function chk(){
var obj = document.getElementById("mySelect");
obj.options[obj.selectedIndex] = new Option("我的测试","4");//改变当前选中的文本
//obj.options.add(new Option("我的测试","4"));//再添加一个option
//alert(obj.selectedIndex);//显示序号,option自己设置的
// obj.options[obj.selectedIndex].text = "我的测试";//更改值
//obj.remove(obj.selectedIndex);逐个删除
//obj.options.length = 0;//删除全部
//t = obj.options[obj.selectedIndex].text;//获取文本
//alert(t);
//v = obj.options[obj.selectedIndex].value;//获取选中文本的值
// alert(v);
}
</script>
</head>
<body>
<select id="mySelect">
<option value="1111">我的1111</option>
<option value="2222">我的2222</option>
<option value="3333">我的3333</option>
<option value="4444">我的4444</option>
</select>
<input type="button" name="button" value="查看结果" onclick="javascript:chk();">
</body>
</html>
发表评论
-
jquery 传一个json对象到 java后台
2017-09-07 23:03 1669前台 var data={}; data.fid=&quo ... -
图标前台框架hcharts
2014-12-26 13:32 955http://www.hcharts.cn/demo/in ... -
Js操作Select大全
2012-11-09 20:43 1054转 http://www.cnblogs.com/Heris ... -
IE 无法运行javascript
2012-06-11 10:02 2209将下面的脚本编程一个bat文件,然后运行。 rundll32 ... -
javascript 判断页面加载完毕
2012-05-14 15:11 2233这个函数用户判断当页面加载完毕的时候,设置按钮上的文本如果页面 ... -
js获取节点 dom操作
2012-05-14 13:09 7115接口 nodeType常量 nod ... -
ExtJs表格控件Grid
2011-09-17 22:29 1363下面介绍三种ExtJs中最 ... -
ExtJs树TreePanel
2011-09-17 22:27 24411.创建一个简单(静态)的树 /** 创建 ... -
ExtJs表单FormPanel
2011-09-17 22:17 10801.简单表单实例 /** 简单表单实例(与JSP ... -
extjs 创建简单Meun,实现在TreePanel上面右键.
2011-09-17 22:02 5247/** 创建简单Menu */ fu ... -
javascript右键菜单(所有浏览器)
2011-04-29 09:33 1381<HTML> <HEAD> ... -
jQuery 图片裁切
2011-01-12 17:59 1258jQuery 图片裁切 头像裁切软件 -
javascript对xml的解析
2010-10-28 12:58 1171<!DOCTYPE html PUBLIC " ... -
javascript图片大小图片尺寸代码
2010-10-11 13:19 2583<title>JS实现单击图片获取图片的原始尺寸代 ... -
遍历session
2010-09-14 09:59 1438在jsp中加入如下代码即可实现功能: <% Enum ... -
window.showModalDialog模式对话框
2010-09-09 08:58 1785基本介绍: showModalDialo ... -
jQuery 工具安装-jqueryWTP
2010-07-23 18:11 49181. jQuery 工具安装-jqueryWTP ... -
Spket的插件安装方法
2010-07-23 18:02 1391首先下载一个Spket的插件,下载过后就是一个spket-1. ... -
jQuery获取form表单元素的值
2010-07-07 17:32 13800var mykindtxt=$("#kind op ... -
JavaScript图片裁切主要是获取他们的大小发送给系统。
2010-06-13 09:42 1257有个函数添加了return 之后,他后面的代码就不在执行了。这 ...
相关推荐
### JavaScript Select Option 操作详解 #### 一、检测是否有选中项 在处理表单时,经常需要检测用户是否已选择了某个 `<select>` 元素中的 `<option>` 项。以下是一个简单的示例来实现这一功能: ```javascript ...
### JavaScript 操作 Select 和 Option 的方法详解 在网页开发中,`<select>` 元素是一种常见的表单控件,用于收集用户输入的选择项。它通常包含多个 `<option>` 子元素供用户选择。通过 JavaScript,我们可以实现...
### JavaScript Options 属性集合操作详解 #### 一、概述 在网页开发中,`<select>` 元素常用于创建下拉列表,而 `<option>` 元素则用于定义下拉列表中的具体选项。通过 JavaScript 操作这些元素,开发者可以实现...
### jQuery操作Select大全知识点详解 #### 1. 概述 jQuery操作Select大全主要包含了一系列使用jQuery操作select下拉列表的方法和实例。在Web开发过程中,动态地与select元素进行交互是常见的需求,jQuery为此提供...
### JavaScript 多级联动 Select 实现详解 在前端开发中,多级联动 Select 是一个常见的需求,尤其是在处理地区选择、分类导航等场景时。本文将深入解析如何利用原生 JavaScript 实现多级联动 Select,包括其核心...
### Js操作Select大全知识点详解 #### 一、概述 JavaScript(简称JS)是网页开发中不可或缺的一部分,尤其在处理用户界面交互方面具有重要作用。本文档将详细介绍如何利用原生JavaScript和jQuery来操作`<select>`...
2. **通过JavaScript操作`select`元素** - 获取`select`元素:可以使用`document.getElementById('mySelect')`或`document.querySelector('#mySelect')`来获取`select`元素。 - 添加/删除选项: - 添加选项:`...
本文将详细介绍如何使用JavaScript进行 `<select>` 控件的各种操作。 #### 二、知识点详解 ##### 1. 判断 `select` 选项中是否存在 `value="paraValue"` 的 Item 为了检查 `<select>` 中是否存在特定 `value` 的...
本文将详细介绍如何使用JavaScript删除select元素中的所有option标签,并给出几种不同的实现方法。在Web开发过程中,经常需要动态地对select元素进行操作,例如清除已有选项,以适应不同的应用场景。正确地删除...
在网页开发中,jQuery是一个非常流行的JavaScript库,它极大地简化了DOM操作,包括对`<select>`元素的操作。本文将详细解析如何使用jQuery来获取和设置`<select>`元素的值,以及如何设置选中项。 1. **设置value为...
**jQuery Select2组件详解** `jQuery Select2`是一款强大的、高度可定制的下拉选择框插件,它在原生HTML `<select>` 元素的基础上提供了丰富的功能和优秀的用户体验。这款组件广泛应用于网页开发中,使得传统的单选...
**Select2插件详解** Select2是一款非常流行的JavaScript库,基于jQuery设计,它的主要目标是为HTML中的`<select>`元素提供一个强大的替代方案。在网页开发中,原生的`<select>`元素功能有限,样式单一,而Select2...
本篇文章将详细讲解jQuery如何操作`select`及其内部的`option`元素。 首先,`select`标签的HTML结构如下: ```html <select class="xxx" id="yyy"> <option value=""></option> ... <option value=""></option>...
在网页开发过程中,经常需要对页面中的元素进行动态操作,比如清除`<select>`下拉列表中的选项。本文将详细介绍如何使用JavaScript实现`select`清零,并深入探讨相关的知识点。 ### 一、基本概念 #### 1.1 `...
本文将详细介绍如何使用JavaScript和jQuery来操作`select`元素。 ## JavaScript 中 select 的用法 ### 清除所有选项 ```javascript var obj = document.getElementById('selectid'); obj.options.length = 0; ``` ...
### JavaScript 实现 Select 改变文字颜色的知识点详解 #### 一、背景介绍 在网页开发过程中,有时候我们需要实现一种动态效果,即用户通过选择不同的选项来改变页面中某些元素的样式,比如字体颜色。本篇文章将...
在`bootstrap-select-1.10.0`这个压缩包中,包含了该插件的源码、CSS样式和JavaScript文件,开发者可以根据需求选择合适的版本进行引用。同时,为了实现特定功能或自定义样式,可以查阅官方文档以获取更多配置选项和...
具体包括了如何通过JSP和JavaScript动态控制`select`元素的`disabled`属性,以及如何在表单提交前解除该属性以确保数据能够正确传递给服务器端。这种方法适用于多种应用场景,特别是在需要限制用户交互的同时保持...