下拉列表框处理操作主要使用的是一个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. 利用java实现的一个发送手机短信的小例子

    今天闲来无事,在微博上看到一个关于用java实现的一个发送手机短信的程序,看了看,写的不太相信,闲的没事,把他整理下来,以后可能用得着 JAVA发送手机短信,流传有几种方法:(1)使用webservi ...

  2. StringUtils cannot be resolved

    I am using Java server pages and for using String Manipulations and i am Using StringUtils which i a ...

  3. Linux下的mongodb分片部署

    前提: 分片服务器不设置从服务和均衡服务,只有主服务器;当前测试为所有服务器均在同一台物理机上. 1.测试环境:192.168.1.55. 2.测试模式:单机.3.服务:分片服务器1:192.168. ...

  4. Javascript 笔记与总结（2-17）事件委托

    [例]五子棋,单次点击为黑色,偶次点击为白色.e.target 的用法 <!DOCTYPE html> <html lang="en"> <head& ...

  5. Cent OS 6.6 下安装mysql（5.5.20）和 PHP（5.3.10）

    0.准备步骤(没有连接网络的 linux): 挂载光盘.让网络 yum 源失效.修改光盘 yum 文件.安装 c 语言编译器 gcc. 1.MySQL(5.5.20) 下载 mysql 5.5.20 ...

  6. nginx 配置文件分析以及配置负载均衡器

    修改Nginx核心配置文件nginx.conf # cat /usr/local/nginx/conf/nginx.conf user www www; worker_processes ; # 工作 ...

  7. 西川善司【神秘海域（Uncharted）】的图形分析

          本文是为传播0月8日发售的[神秘海域 合集]魅力而短篇连载的第2回,这次主要集中在神秘海域系列的图形的技术方面.原文链接在 http://weekly.ascii.jp/elem/000/ ...

  8. $().html(value) vs $().empty().append(value)

    当需要清空某个dom结点内容时,我所知道的有两种方法: 1.Element.removeChild(child) // Removing all children from an element va ...

  9. mysql入门问题

    1.给列设置默认时间 在创建表的图形化界面,不能直接用函数sysdate()或者now()来设置默认当前时间,要用sql脚本创建的话就可以 IF NOT EXISTS `tb_1` THENBEGIN ...

  10. 统计学习方法笔记 -- Boosting方法

    AdaBoost算法 基本思想是,对于一个复杂的问题,单独用一个分类算法判断比较困难,那么我们就用一组分类器来进行综合判断,得到结果,"三个臭皮匠顶一个诸葛亮" 专业的说法, 强可 ...