<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8">
<title></title>
</head>

<body>
<select id="city" name="city" size="5">
<option value="CD">成都</option>
<option value="CQ">重庆</option>
<option value="GY" selected="selected">贵阳</option>
<option value="XZ">西藏</option>
<option value="XJ">新疆</option>
</select>
<input type="button" value="one" onclick="show(myselect.options[0]);" />
<input type="button" value="two" onclick="show(myselect.options[myselect.selectedIndex-1]);" />
<input type="button" value="three" onclick="show(myselect.options[myselect.selectedIndex+1]);" />
<input type="button" value="four" onclick="show(myselect.options[myselect.length-1]);" />
</body>
<script>
var myselect = document.getElementById('city');
var show = function(city) {
alert(city.text);
}
</script>

</html>

DOM操作表单(select下拉选框)的更多相关文章

  1. select下拉选框的默认值,包括每次进入页面的默认值

    下拉选: <select onchange="selectTotal(this.value)" style="width: 50px;">      ...

  2. iview 表单验证 input 用失去焦点事件 blur, select下拉选框 要用change事件 验证

    birthday: [{ required: true, message: '内容不能为空', trigger: 'blur' }],belongDept: [{ required: true, me ...

  3. Javascript -- 示例:多选下拉选框

    1. 示例:多选下拉选框 <html> <head> <meta http-equiv="Content-Type" content="te ...

  4. CSS自定义select下拉选择框(不用其他标签模拟)

    今天群里有人问到怎么自定义select下拉选择框的样式,于是群里就展开了激烈的讨论,刚开始一直就是考虑怎样使用纯CSS实现,把浏览器默认的样式覆盖掉,但最后均因兼容问题处理不好而失败告终,最后的解决方 ...

  5. 微信小程序之自定义select下拉选项框组件

    知识点:组件,animation,获取当前点击元素的索引与内容 微信小程序中没有select下拉选项框,所以只有自定义.自定义的话,可以选择模板的方式,也可以选择组件的方式来创建. 这次我选择了组件, ...

  6. Django forms表单 select下拉框的传值

    今儿继续做项目,学习了Django的forms生成前端的代码. forms.py class SignupForm(forms.Form): username = forms.CharField(va ...

  7. [jQueryUI] – Chosen:select下拉选择框美化插件及问题

    Chosen 是一个支持jquery的select下拉框美化插件,它能让丑陋的.很长的select选择框变的更好看.更方便.不仅如此,它更扩展了select,增加了自动筛选的功能.它可对列表进行分组, ...

  8. angularjs select下拉搜索框

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. 【java+selenium3】select 下拉选 (八)

    一.select 下拉框 1.下拉选的处理类:Select 如果页面元素是一个下拉框,我们可以将此web元素封装成Select对象. Select select = new Select(WebEle ...

随机推荐

  1. openproject安装与使用

    思路: 1.生成config配置文件 2.导出配置文件,修改配置文件,删除容器,重新部署容器 3.登录后配置, 4.配置git,可以从openproject里查看gitlab上的代码库 第一次安装: ...

  2. 能够放在文档的 <head> 中的各种配置元素

    一份关于任何可以写入到你的文档中 <head> 部分的清单 最小推荐 <meta charset="utf-8"> <meta http-equiv= ...

  3. Java NIO学习与记录(三): Scatter&Gather介绍及使用

     Scatter&Gather介绍及使用 上一篇知道了Buffer的工作机制,以及FileChannel的简单用法,这一篇介绍下 Scatter&Gather 1.Scatter(分散 ...

  4. express后端和fetch前端的json数据传递

    在使用express做后端,前端使用fetch API来请求后端时,一般都是用 JSON 数据进行通信的. 下面是一个简单的例子: 前端: if (up) { var passwordAgain = ...

  5. Python爬虫学习:一些关于爬虫的知识的充电

    什么是Http和Https http协议:全称是HyperText Transfer Protocol,中文意思是超文本传输协议,是一种发布和接收Html页面的方法.默认的端口号是80 https协议 ...

  6. rocksDB vs InnoDB vsTokuDB

    原文地址 https://minervadb.com/index.php/2018/08/06/comparing-tokudb-rocksdb-and-innodb-performance-on-i ...

  7. 【数组】Triangle

    题目: Given a triangle, find the minimum path sum from top to bottom. Each step you may move to adjace ...

  8. Android多媒体技术之视频播放

    1.Android中视频播放方式 surfaceView+MediaPlayer,通过MediaPlayer来控制视频的播放.暂停.进度等: 使用VideoView 来播放,这个类其实也是继承了Sur ...

  9. 西蒙布朗-C4模型

    关于 C4 模型的一些解释 C4 模型是来自 software architecture for developers 一书的定义,指的是 Context 上下文场景.Container 容器.Com ...

  10. C#的可空类型与不可空类型

    null:为空,表示产量没有指向任何对象, 如:string = null; int a = null;//是错的 但可以这样,在类型后面加一个问号. int? a = null;//这就是正确的,是 ...