- 判断select选项中 是否存在Value="paraValue"的Item
- 向select选项中 加入一个Item
- 从select选项中 删除一个Item
- 删除select中选中的项
- 修改select选项中 value="paraValue"的text为"paraText"
- 设置select中text="paraText"的第一个Item为选中
- 设置select中value="paraValue"的Item为选中
- 得到select的当前选中项的value
- 得到select的当前选中项的text
- 得到select的当前选中项的Index
- 清空select的项
- js 代码
- // 1.判断select选项中 是否存在Value="paraValue"的Item
- function jsSelectIsExitItem(objSelect, objItemValue) {
- var isExit = false;
- for (var i = 0; i < objSelect.options.length; i++) {
- if (objSelect.options[i].value == objItemValue) {
- isExit = true;
- break;
- }
- }
- return isExit;
- }
- // 2.向select选项中 加入一个Item
- function jsAddItemToSelect(objSelect, objItemText, objItemValue) {
- //判断是否存在
- if (jsSelectIsExitItem(objSelect, objItemValue)) {
- alert("该Item的Value值已经存在");
- } else {
- var varItem = new Option(objItemText, objItemValue);
- objSelect.options.add(varItem);
- alert("成功加入");
- }
- }
- // 3.从select选项中 删除一个Item
- function jsRemoveItemFromSelect(objSelect, objItemValue) {
- //判断是否存在
- if (jsSelectIsExitItem(objSelect, objItemValue)) {
- for (var i = 0; i < objSelect.options.length; i++) {
- if (objSelect.options[i].value == objItemValue) {
- objSelect.options.remove(i);
- break;
- }
- }
- alert("成功删除");
- } else {
- alert("该select中 不存在该项");
- }
- }
- // 4.删除select中选中的项
- function jsRemoveSelectedItemFromSelect(objSelect) {
- var length = objSelect.options.length - 1;
- for(var i = length; i >= 0; i--){
- if(objSelect[i].selected == true){
- objSelect.options[i] = null;
- }
- }
- }
- // 5.修改select选项中 value="paraValue"的text为"paraText"
- function jsUpdateItemToSelect(objSelect, objItemText, objItemValue) {
- //判断是否存在
- if (jsSelectIsExitItem(objSelect, objItemValue)) {
- for (var i = 0; i < objSelect.options.length; i++) {
- if (objSelect.options[i].value == objItemValue) {
- objSelect.options[i].text = objItemText;
- break;
- }
- }
- alert("成功修改");
- } else {
- alert("该select中 不存在该项");
- }
- }
- // 6.设置select中text="paraText"的第一个Item为选中
- function jsSelectItemByValue(objSelect, objItemText) {
- //判断是否存在
- var isExit = false;
- for (var i = 0; i < objSelect.options.length; i++) {
- if (objSelect.options[i].text == objItemText) {
- objSelect.options[i].selected = true;
- isExit = true;
- break;
- }
- }
- //Show出结果
- if (isExit) {
- alert("成功选中");
- } else {
- alert("该select中 不存在该项");
- }
- }
- // 7.设置select中value="paraValue"的Item为选中
- document.all.objSelect.value = objItemValue;
- // 8.得到select的当前选中项的value
- var currSelectValue = document.all.objSelect.value;
- // 9.得到select的当前选中项的text
- var currSelectText = document.all.objSelect.options[document.all.objSelect.selectedIndex].text;
- // 10.得到select的当前选中项的Index
- var currSelectIndex = document.all.objSelect.selectedIndex;
- // 11.清空select的项
- document.all.objSelect.options.length = 0;
- 浏览: 39288 次
- 性别:
- 来自: 北京
文章分类
最新评论
发表评论
-
ie6,7 SCRIPT1028: 缺少标识符、字符串或数字
2014-04-21 09:57 1196头一次写js,就遇到这个bug,傻了,不知道该怎么做,不过幸 ... -
java web项目,防止sql注入
2014-03-18 09:39 0... -
springsecurity扩展自定义会话管理-提供管理员调用踢出用户
2014-01-17 14:56 614主要涉及的类如下: Htt ... -
java web 过滤器和拦截器的区别和使用
2014-01-16 12:35 6441、首先要明确什么是拦截器、什么是过滤器 1.1 ... -
javascript控制弹出窗口的大小,及最大化
2014-01-03 11:43 1477【最基本的弹出窗口代码】 其实代码非常简单: <SCR ... -
javascript跳转页面方法大全
2014-01-03 11:40 503<span id="tiao"&g ... -
将java后台的代码加载到前台页面select标签
2013-12-29 21:54 854java 后台代码: List<SuperRec ... -
struts2文件下载
2013-12-29 21:54 489web.xml <?xml version=&q ... -
js导航菜单
2013-12-29 21:54 405/** 样式 */ .chanel_l ... -
JS截取字符串substr 和 substring方法的区别
2013-12-27 14:52 526substr 方法 返回一个从指定位置开始的指定长度的 ... -
Struts2的iterator各种用法
2013-12-27 14:51 4444、普通属性 public String execu ... -
struts2源码 导入eclipse工程
2013-12-24 14:49 779struts2 之后都采用maven 编译、管理代码。 因 ... -
JS解析json数据(如何将json字符串转化为数组)
2013-12-12 11:36 568<SCRIPT LANGUAGE="Java ... -
反射实现 AOP 动态代理模式(Spring AOP 的实现 原理)
2013-12-07 15:18 476其实AOP的意思就是面向切面编程.OO注重的是我们解决问题 ... -
struts2 poi excel 导出
2013-12-02 13:36 6101、struts2配置文件 <!-- 下载专题库资源 ... -
js判断滚轮是否到达页面的底部
2013-11-09 17:23 787// JavaScript Document ... -
JS滚动条到网页底部自动加载更多内容
2013-11-02 15:40 986<html> <head> <m ...
相关推荐
### JavaScript操作select大全 在网页开发中,`<select>`元素是用于创建下拉列表的常用HTML标签之一。本文档提供了详细的JavaScript操作`<select>`元素的方法,包括判断选项是否被选中、增删改选项及其属性等实用...
### Js操作Select大全知识点详解 #### 一、概述 JavaScript(简称JS)是网页开发中不可或缺的一部分,尤其在处理用户界面交互方面具有重要作用。本文档将详细介绍如何利用原生JavaScript和jQuery来操作`<select>`...
根据给定的信息,本文将对JavaScript操作`<select>`元素的方法进行详细介绍,这些方法涵盖了创建、选择、删除选项等操作。 ### 1. 检查`<select>`元素是否存在值为`paraValue`的项 ```javascript function ...
以上是JavaScript操作`<select>`标签的一些基本方法。在实际开发中,这些功能可能会作为更复杂交互的基础,例如动态加载数据、响应用户事件等。了解并熟练掌握这些操作,对于提升网页的交互性和用户体验至关重要。
Javascript 操作select控件大全(新增、修改、删除、选中、清空、判断存在等
js 操作 select 控件大全是 JavaScript 中对 select 控件的各种操作的集合,包括新增、修改、删除、选中、清空、判断存在等多种操作。下面将对这些操作进行详细的介绍和讲解。 一、 判断 select 选项中是否存在 ...
<title>JS 操作 Select 和 Option <script language="JavaScript"> function $(id) { return document.getElementById(id); } function show() { var selectObj = $("area"); var myOption = document....
### jQuery操作Select大全知识点详解 #### 1. 概述 jQuery操作Select大全主要包含了一系列使用jQuery操作select下拉列表的方法和实例。在Web开发过程中,动态地与select元素进行交互是常见的需求,jQuery为此提供...
以上代码展示了JavaScript操作`select`元素的一些常见方法。首先,`jsSelectIsExitItem`函数用于检查`select`中是否存在指定`value`的选项。如果存在,它将返回`true`,否则返回`false`。接着,`jsAddItemToSelect`...
### JavaScript操作表单Select元素的常用步骤 在Web开发中,`<select>`标签用于创建一个下拉列表供用户选择选项。使用JavaScript可以方便地控制这些下拉列表的行为,例如添加、删除或修改选项等。下面详细介绍如何...
根据给定的文件标题、描述、标签以及部分内容,本文将深入解析HTML中使用JavaScript操作`<select>`下拉框的全面方法。`<select>`元素是网页表单中用于创建下拉列表的关键部分,而通过JavaScript,我们可以动态地添加...
这篇博客“javascript操作Select标记中options集合”深入探讨了如何利用JavaScript动态地管理和操作这些选项。以下是关于这个主题的一些关键知识点: 1. **DOM操作**:在JavaScript中,我们可以使用DOM(Document ...
### JavaScript 操作 Select 下拉框的关键知识点 在 Web 开发中,`<select>` 元素用于创建下拉列表(或选择框)。这些选择框在用户界面中非常常见,可以用来收集用户输入的信息,比如让用户从一系列选项中选择一个...
`select2.min.js`是JavaScript文件的最小化版本,用于减少页面加载时间;而`select2.min.css`则是CSS文件的最小化版本,负责样式呈现。这两个文件应当在HTML页面中正确引用,以便Select2库正常工作。 在实际应用中...
### JavaScript操作select&&table #### 一、JavaScript操作Select元素 在Web开发中,`<select>`元素用于创建下拉列表。通过JavaScript可以对这些下拉列表进行动态操作,包括添加选项、删除选项、获取选中的值等。...
Javascript操作Select和Option 一个网页 挺全的
2. **通过JavaScript操作`select`元素** - 获取`select`元素:可以使用`document.getElementById('mySelect')`或`document.querySelector('#mySelect')`来获取`select`元素。 - 添加/删除选项: - 添加选项:`...