zoukankan
html css js c++ java
Js操作Select大全
判断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
;
查看全文
相关阅读:
水调歌头·1024
网页开发方式-从静态页面到服务端渲染
完美融合 nextjs 和 antd
commanderJs编写命令行工具(cli)
[信息安全] 05 X.509 公钥证书的格式标准
[Cake] 3. dotnet 本地工具 cake & dotnet format
[计算机网络] 00 概述
[Cake] 2. dotnet 全局工具 cake
[解读REST] 0.REST 相关参考资料
[OIDC in Action] 3. 基于OIDC(OpenID Connect)的SSO(添加Github OAuth 2.0的支持)
原文地址:https://www.cnblogs.com/dqsweet/p/4927743.html
最新文章
飞越面试官(二)--JUC
飞越面试官(一)--Java基础
java面试知识迷你版
Exception in thread "main" NoNodeAvailableException[None of the configured nodes are available
No mapping found for HTTP request with URI [/***] in DispatcherServlet with name 'dispatcherServlet'
一个简单的人物图片相似对比程序
SpringCloud 应用在 Kubernetes 上的最佳实践 — 部署篇(开发部署)
记录一次 Arthas 使用
阿里开源那个牛哄哄问题排查工具竟然不会用?最佳实践来了!
2020 年,从架构谈起,到 Mesh 结束
热门文章
进击的 Kubernetes 调度系统(二):支持批任务的 Coscheduling/Gang scheduling
如何在工作中快速成长?致工程师的 10 个简单技巧
11 个新项目入选 CNCF Sandbox | 云原生生态周报 Vol. 56
云原生五大趋势预测,K8s 安卓化位列其一
深度聚焦 3 大技术领域,阿里云将重磅亮相首届线上 KubeCon
OAM K8s 标准实现 Crossplane 项目进入 CNCF Sandbox
对不起
前端公共图表数据大盘方案
小程序websocket心跳库——websocket-heartbeat-miniprogram
从监控异常发现网络安全
Copyright © 2011-2022 走看看