下拉列表框处理操作主要使用的是一个onchange的事件,此事件描述的是内容改变后行为。

范例:观察下拉列表框的事件处理

代码:

<!doctype html>
<html lang = "zh-CN">
<head> <meta charset="utf-8">
<meta name="description" content="this is a checkbox example">
<meta name="keywords" content="checkbox,html,js">
<title>下拉框的测试</title> <script type="text/javascript">
window.onload = function () {
document.getElementById('city').addEventListener('change',function(){
alert("当前选项是:"+this.value);
},false);
}
</script> </head>
<body>
<form action="">
请选择城市:
<select id = "city">
<option value="BJ - 北京">北京</option>
<option value="SH - 上海">上海</option>
<option value="NJ - 南京">南京</option>
<option value="TJ - 天津">天津</option>
<option value="HF - 合肥">合肥</option>
<option value="WH - 武汉">武汉</option>
</select>
</form>
</body>
</html>

效果图如下:

默认状态:        

随意选择一个城市时:

选择成功后的结果:

JavaScript:下拉列表框的事件处理的更多相关文章

  1. 【repost】JavaScript 事件模型 事件处理机制

    什么是事件? 事件(Event)是JavaScript应用跳动的心脏 ,也是把所有东西粘在一起的胶水.当我们与浏览器中 Web 页面进行某些类型的交互时,事件就发生了.事件可能是用户在某些内容上的点击 ...

  2. [转]理解JavaScript中的事件处理

    什么是事件? 事件(Event)是JavaScript应用跳动的心脏 ,也是把所有东西粘在一起的胶水.当我们与浏览器中 Web 页面进行某些类型的交互时,事件就发生了.事件可能是用户在某些内容上的点击 ...

  3. 理解JavaScript中的事件处理

    什么是事件? 事件(Event)是JavaScript应用跳动的心脏 ,也是把所有东西粘在一起的胶水.当我们与浏览器中 Web 页面进行某些类型的交互时,事件就发生了.事件可能是用户在某些内容上的点击 ...

  4. 理解JavaScript中的事件处理 阻止冒泡event.stopPropagation();

    原文地址:http://www.cnblogs.com/binyong/articles/1750263.html 这篇文章对于了解Javascript的事件处理机制非常好,将它全文转载于此,以备不时 ...

  5. JavaScript 事件模型 事件处理机制

    什么是事件? 事件(Event)是JavaScript应用跳动的心脏 ,也是把所有东西粘在一起的胶水.当我们与浏览器中 Web 页面进行某些类型的交互时,事件就发生了.事件可能是用户在某些内容上的点击 ...

  6. 详解JavaScript中的事件处理

    在漫长的演变史,我们已经告别了内嵌式的事件处理方式(直接将事件处理器放在HTML元素之内来使用),今天的事件,它已是DOM的重要组成部分,遗憾的是,IE继续保留它最早在IE4.0中实现的事件模型,以后 ...

  7. JavaScript权威设计--事件处理介绍(简要学习笔记十七)

    1.事件相关概念 事件类型:一个用来说明发生什么类型事件的字符串 事件目标:是发生的事件或与之相关的对象. 事件处理程序(事件监听程序):是处理货响应事件的函数. 事件对象:是与特定事件相关并且包含有 ...

  8. javascript事件和事件处理

    于js期间事件处理被分成三个步骤: 1.发生事件 2.启动事件处理程序 3.事件处理程序做出反应 事件处理程序的调用 1.在javascript中 在javascript中调用事件处理程序,首先要获得 ...

  9. JavaScript权威指南--事件处理

    知识要点 客户端JavaScript程序采用了异步事件驱动变成模型(13.3.2节).这种风格并不只应用于web编程,所有使用图形用户界面的应用程序都采用它,它们静待某些事件发生,然后响应. 事件就是 ...

随机推荐

  1. 【C语言】15-预处理指令1-宏定义

    预处理指令简介 1.C语言在对源程序进行编译之前,会先对一些特殊的预处理指令作解释(比如之前使用的#include文件包含指令),产生一个新的源程序(这个过程称为编译预处理),之后再进行通常的编译 2 ...

  2. Symantec Liveupdate Administrator的搭建

      1. My Symantec Products 选择需要更新的产品 2. Source Servers 选择ftp, 下载比较稳定 3. Distribute Center 类似于WSUS中的ap ...

  3. 《GK101任意波发生器》升级固件发布(版本:1.0.2build690)

    一.固件说明: 硬件版本:0,logic.3 固件版本:1.0.2.build690 编译日期:2015年4月24日 ====================================== 二. ...

  4. 【iM_VGA模块】运行 ucgui 演示!

    挂在 iCore2 双核心板上的 VGA模块,跑 ucgui DEMO 演示.大家看看! ============================== 技术论坛:http://www.eeschool ...

  5. iOS 键盘的隐藏

     在 iOS开发中 最常用的 一些控件,如TextFiled 和 TextView,点击时会自动弹出键盘,但是隐藏操作需要我们自己来编码完成. 最常用的一种方法是,让TextFiled 和 TextV ...

  6. FastDFS常见命令

    1: 启动FastDFS tracker: ./fdfs_trackered  .../tracker.conf storage: ./fdfs_storaged  .../storage.conf ...

  7. mysql关于字符串字段数据类型

    字符串类型 字符串类型指CHAR.VARCHAR.BINARY.VARBINARY.BLOB.TEXT.ENUM和SET.该节描述了这些类型如何工作以及如何在查询中使用这些类型. 类型 大小 用途 C ...

  8. SharedPreferences封装类SPUtils

    import java.lang.reflect.InvocationTargetException; import java.lang.reflect.Method; import java.uti ...

  9. UIbutton 圆角和边线

    #define WhiteColor [UIColor whiteColor]#define YellowColor  Color_RGB(253,131,42,1)//主题黄#define Font ...

  10. Ubuntu 12.04 卸载 VMware

    cd /usr/bin sudo vmware-installer -u vmware-player