博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
JavaScript学习笔记之下拉选择框的操作
阅读量:6073 次
发布时间:2019-06-20

本文共 1167 字,大约阅读时间需要 3 分钟。

对于下拉框的操作十分繁多,这几天项目须要就总结一下

一、动态构建option

有时候我们须要动态构建下拉选择框里面的值,这里我们就要用到 var varItem = new Option("文本","值");构建一个或多个<option value="值">文本</option>

var varItem = new Option("studentName","name");  

样例1:窗口在载入完成后,就自己主动构造一个option

								
当然我认为应该能够一下子构建多个options,可能是声明一个数组或者一个Json对象加入进去,可是详细怎么一下子添加多个option,会的朋友望指点

样例2:利用JS删除一栏为stuNumber的下拉选择框,以后假设做成动态的话就能够通过传參调用方法来删除指定栏的信息了。

								

样例3:删除选中的下拉框的值,能够通过一个事件方法来实现,我们能够随便选中一栏,然后点击button,然后那一栏就将被删除

										

样例4:将下拉选择框中的值清空

								

样例5:想得到option里面name的值,我们通过一个button事件,点击,弹出对话框,里面的信息就是name的值

										
关键思路还是先得到select下拉选择框这个对象,遍历选中的option,对象.value就能够表达出来。
那我们要是一開始默认就想载入一个特定的option,那我们能够特定定义一个window.onload事件,指定要载入的option的值

								

样例6:输出option的下标值,从0開始

										

二、select的回显(与jsp结合)

通常我们运行更新用户信息的时候,须要回显下拉选择框的信息,这时候假设用JSP开发的话,能够利用JSTL标签的<c:if>

首先引入JSTL标签库:<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>

持续总结中~~~

參考博客:

(转载本站文章请注明作者和出处
 ,请勿用于不论什么商业用途)

你可能感兴趣的文章
CodeForces 767C Garland
查看>>
postman/jmeter 请求https接口配置问题
查看>>
事务的学习,从jdbc开始:jdbc对事务的支持与实现
查看>>
[人工智能]追逐与躲闪
查看>>
CentOS上搭建Yii2 --2017
查看>>
防范DDOS攻击脚本
查看>>
在阿里云上挂在/data脚本
查看>>
解决文件大小上传限制
查看>>
Anconda 3.7安装以及使用详细教程
查看>>
three.js之让物体动起来方式(二)移动物体
查看>>
ARM总线架构
查看>>
Nexus构建
查看>>
php读入mysql数据并以表格形式显示(表单实现无刷新提交)
查看>>
ECMAScript 原始类型
查看>>
css3 图片 抖动效果
查看>>
【距离GDKOI:44天&GDOI:107天】【BZOJ1040】[ZJOI2008] 骑士 (环套树DP)
查看>>
DOM_01之树及遍历
查看>>
科大域名搭建个人网站
查看>>
让开发更简单 —— Coding Enterprise 发布
查看>>
后缀自动机
查看>>