【转】js中select的基本操作
判断select选项中 是否存在Value="paraValue"的Item
// 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;
}

向select选项中 加入一个Item
// 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("成功加入");
}
}

从select选项中 删除一个Item
// 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中 不存在该项");
}
}
删除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;
}
}
}
修改select选项中 value="paraValue"的text为"paraText"
// 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中 不存在该项");
}
}
设置select中text="paraText"的第一个Item为选中
// 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中 不存在该项");
}
}
设置select中value="paraValue"的Item为选中
// 7.设置select中value="paraValue"的Item为选中
document.all.objSelect.value = objItemValue;
得到select的当前选中项的value
// 8.得到select的当前选中项的value
var currSelectValue = document.all.objSelect.value;
得到select的当前选中项的text
// 9.得到select的当前选中项的text
var currSelectText = document.all.objSelect.options[document.all.objSelect.selectedIndex].text;
得到select的当前选中项的Index
// 10.得到select的当前选中项的Index
var currSelectIndex = document.all.objSelect.selectedIndex;
清空select的项
// 11.清空select的项
document.all.objSelect.options.length = 0;
【转】js中select的基本操作的更多相关文章
- 关于js中select的简单操作,以及js前台计算,span简单操作
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- js中select标签中的option选择
f1 = function () { //var selected_val = document.getElementById(test).value; var obj = document.getE ...
- JS 获取select(多选下拉)中所选值的示例代码
通过js获取select(多选下拉)中所选值,具体实现如下,有需要的朋友可以参考下,希望对大家有所帮助 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML ...
- Js实现select联动,option从数据库中读取
待要实现的功能:页面有两个select下拉列表,从第一个select中选择后,在第二个select中出现对应的列表选择,再从第二个select中选择后,在一个text中显示对应的信息.两个select ...
- Vue.js中使用select选择下拉框
在Vue.js中使用select选择下拉框有两种方法: 第一种: Add.html: <select v-model="sysNotice.noticeType" id=&q ...
- JS中如何获取<Select>中value和text的值
原文地址:JS中如何获取<Select>中value和text的值 html代码: <select id = "city" onchange="chan ...
- JS中Float类型加减乘除 修复 JQ 操作 radio、checkbox 、select LINQ to SQL:Where、Select/Distinct LINQ to SQL Count/Sum/Min/Max/Avg Join
JS中Float类型加减乘除 修复 MXS&Vincene ─╄OvЁ &0000027─╄OvЁ MXS&Vincene MXS&Vincene ─╄Ov ...
- js中创建html标签、加入select下默认的option的value和text、删除select元素节点下全部的OPTION节点
<pre name="code" class="java"> jsp 中的下拉框标签: <s:select name="sjx&qu ...
- node.js中对 redis 的安装和基本操作
一.win下安装redis https://github.com/MicrosoftArchive/redis/releases 下载Redis-x64-3.2.100.zip,然后解压,放到自定义目 ...
随机推荐
- python爬虫之request and BeautifulSoup
1.爬虫的本质是什么? 模仿浏览器的行为,爬取网页信息. 2.requests 1.get请求 无参数实例 import requests ret = requests.get('https://gi ...
- 全栈JavaScript之路( 二十四 )DOM2、DOM3, 不涉及XML命名空间的扩展
版权声明:本文为博主原创文章.未经博主同意不得转载. https://blog.csdn.net/hatmore/article/details/37658167 (一)DocumentType 类型 ...
- 【WEB】高并发Web服务的演变-节约系统内存和CPU
目前主流浏览器通常可以存在2-6个并发. 连接和请求,占据了服务器的大量CPU和内存等资源.在资源数目超过100+的网站页面中,使用更多的下载连接,非常有必要. 缓解“高并发”的压力的手段. 一. W ...
- wap网站即手机端网页SEO优化注意事项及方法
定位和页面设计: 无论是PC端还是移动端,网站 都要考虑清楚消费群体的定位问题.虽然智能手机用户数量非常普及,但是要明白中国的大部分手机用户使用的还是2G网络,一直高 喊的3G.4G手机用户只有大约1 ...
- client = new DatagramSocket(LocalPort) 是说端口已经被占用的意思
ok 现在遇到一个问题,client = new DatagramSocket(LocalPort) 是说端口已经被占用的意思 ref:!!https://community.oracle.com/t ...
- log4j中怎样将信息写入到不同的日志文件
log4j中怎样将信息写入到不同的日志文件 有没有想过为什么我们用:Logger logger = Logger.getLogger(ABC.class) ;来得到 logger? 不想只看人家的 d ...
- Data Structure Binary Tree: Boundary Traversal of binary tree
http://www.geeksforgeeks.org/boundary-traversal-of-binary-tree/ #include <iostream> #include & ...
- Qt事件机制(是动作发生后,一种通知对象的消息,是被动与主动的总和。先处理自己队列中的消息,然后再处理系统消息队列中的消息)
Qt事件机制 Qt程序是事件驱动的, 程序的每个动作都是由幕后某个事件所触发.. Qt事件的发生和处理成为程序运行的主线,存在于程序整个生命周期. Qt事件的类型很多, 常见的qt的事件如下: 键盘事 ...
- Quartz.Net在C#中的使用
概述 Quartz.NET是一个开源的作业调度框架,非常适合在平时的工作中,定时轮询数据库同步,定时邮件通知,定时处理数据等. Quartz.NET允许开发人员根据时间间隔(或天)来调度作业.它实现了 ...
- redis主从架构及redis集群
https://redis.io/topics/cluster-spec Redis Cluster does not support multiple databases like the stan ...