这个案例对经常写前端程序的人来讲应该比较简单，不过像我这种习惯于后台开发，对前端不熟悉的人来说，还是有参考意义的。

在asp.net里面，经常需要响应下拉列表DropDownList的SelectedIndexChanged事件。这个在后台来做，比较简单，只需要设置控件的AutoPostBack 属性为true，然后编写相应的后台事件处理代码即可。

但是，这样的实现方式有时候不太合适。因为，每当修改下拉列表的选项都会触发服务器的响应操作。这个在某些情况下是必要的，但在某些情况下却显得多余。比如：用户只是希望修改选项然后再界面上看到不同的显示，这样的情况仍然采用服务器的事件处理程序来处理就显得有些浪费资源。所以，我们可以考虑采用HTML控件再加上runat=“server”属性，保证服务器能读取该控件的值还可以用js读取控件的值。不说了，看案例吧。

下面的案例希望在修改下拉列表的值时把当前选择的项目的值显示在页面上。

 <html>

 <head>

 <title>test</title>

 <script type="text/javascript">

         function changeTitle() {

             document.getElementById("divTitle").innerHTML = document.getElementById("cars").value;

         }

     </script>

 </head>

 <body>

 <form>

 <div id="divTitle" style="border:solid 1px red; width:200px;height:50px;"></div>

 <select id="cars" name="cars" onchange="changeTitle();">

     <option value="Volvo">Volvo</option>

     <option value="saab">Saab</option>

     <option value="fiat" selected="selected">Fiat</option>

     <option value="audi">Audi</option>

 </select>

 </form>

 </body>

 </html>

js响应HTML客户端下拉列表的修改事件的更多相关文章

  1. 转：Spine.JS+Rails重客户端Web应用技术选型思路：『风车』架构设计

    原文来自于:http://www.infoq.com/cn/articles/fengche-co-architecture 风车这个项目开始于 2011 年 11 月份,之前叫做 Pragmatic ...

  2. easyUI下拉列表点击事件的使用

    可以通过input 和select来创建下拉列表 其中select的创建如下: 通过json来创建js数组 [{ "id":1, "text":"te ...

  3. js/java 获取、添加、修改、删除cookie（最全）

      一.cookie介绍 1.cookie的本来面目 HTTP协议本身是无状态的.什么是无状态呢,即服务器无法判断用户身份.Cookie实际上是一小段的文本信息(key-value格式).客户端向服务 ...

  4. 2dx关于js响应layer触摸消息的bug

    cocos2dx关于js响应layer触摸消息的bug cocos2d-x 3.7 问题描述: 目前这个版本中(3.7),c++层的layer触摸消息只能通过消息的方式发送给js,不能像lua一样直接 ...

  5. vue.js响应式原理解析与实现

    vue.js响应式原理解析与实现 从很久之前就已经接触过了angularjs了,当时就已经了解到,angularjs是通过脏检查来实现数据监测以及页面更新渲染.之后,再接触了vue.js,当时也一度很 ...

  6. JS如何利用定时器实现长按事件

    本篇文章由:http://xinpure.com/js-how-to-use-timer-press-event/ JS 原生事件并没有长按事件,但是我们可以利用一些原有的事件,来实现长按事件 任务需 ...

  7. 信号处理是Unix和LInux系统为了响应某些状况而产生的事件

    信号处理是Unix和LInux系统为了响应某些状况而产生的事件,通常内核产生信号,进程收到信号后采取相应的动作. 例如当我们想强制结束一个程序的时候,我们通常会给它发送一个信号,然后该进程会捕捉到信号 ...

  8. 深入解析vue.js响应式原理与实现

    vue.js响应式原理解析与实现.angularjs是通过脏检查来实现数据监测以及页面更新渲染.之后,再接触了vue.js,当时也一度很好奇vue.js是如何监测数据更新并且重新渲染页面.vue.js ...

  9. Node.js 使用http客户端向网站请求数据并保存

    app.js代码: // 内置http模块,提供了http服务器和客户端功能 var http=require("http"); // 内置文件处理模块 var fs=requir ...

随机推荐

  1. windows 无法分析或处理 pass 报错问题汇总

    日光月华 发表于 2015-2-9 22:02:42 https://www.itsk.com/thread-346404-1-1.html 系统封装失败遇到windows 无法分析或处理 pass ...

  2. abstract class和interface有什么区别?

    1. 接口  只可以定义static  final成员变量. 即使不显性写出来 也还是会是static final 2. 接口的 方法不能有方法体,并且只能是public的. 1.抽象类:如果类中有一 ...

  3. SAP物料批次管理配置及操作手册(轉載)

    这个有待学习 业务说明需要先熟悉基本的物料管理(MM).生产计划管理(PP).销售与分销管理(SD)的相关知识.在化工.制药.快消.汽车零部件等行业,为了进行质量的跟踪,往往需要使用批次管理来监控质量 ...

  4. ROS实际问题解决方法

    1.建立软链接 在路径cd /etc/udev/rules.d中,建立例如50-rfid.rules的文件,它会根据文件名之前的50 51等判断优先级,50的优先级就大于51 如:  KERNEL== ...

  5. iOS基础篇（十七）——UIGestureRecognizer用法

    UIGestureRecognizer(手势识别)在iOS 中非常重要,他极大地提高了移动设备的使用便捷性: 在3.2之前是主要使用的是由UIResponder而来的如下4种方式: - (void)t ...

  6. spring mvc 注解 学习笔记（一）

    以前接触过spring,但是没有接触spring mvc 以及注解的应用,特习之,记之: 注解了解 @Component 是通用标注, @Controller 标注web控制器, @Service 标 ...

  7. Windows无法启动MySQL服务，错误 1053

    解决方法: 正常重启电脑试试看,如果不行,在用下面试试 MYSQL 1053错误 解决方法: 在DOS命令行使用 第一步: 运行 -> cmd + 回车 (输入下面的命令) mysqld-nt ...

  8. hadoop运行原理之Job运行(一) JobTracker启动及初始化

    这部分的计划是这样的,首先解释JobTracker的启动过程和作业从JobClient提交到JobTracker上:然后分析TaskTracker和heartbeat:最后将整个流程debug一遍来加 ...

  9. 如何提高Service的优先级避免被杀死或者杀死后如何再次重启Service？

    2014-01-21 16:45:02 我们知道,当进程长期不活动时,如果系统资源吃紧,会杀死一些Service,或不可见的Activity等所在的进程. 如何避免Service被系统杀死,随便在网上 ...

  10. PowerShell脚本：随机密码生成器

    脚本名称:s随机密码生成器_v2.63.ps1脚本作用:产生随机密码.每密码字符个数,密码数量,存盘位置等可以自定义.脚本用法:脚本采用了硬编码,所以你需要打开脚本,修改如下变量:$生成密码总个数 = ...