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

在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. Deep Learning 5_深度学习UFLDL教程：PCA and Whitening_Exercise（斯坦福大学深度学习教程）

    前言 本文是基于Exercise:PCA and Whitening的练习. 理论知识见:UFLDL教程. 实验内容:从10张512*512自然图像中随机选取10000个12*12的图像块(patch ...

  2. 20160907_Redis问题

    ZC: 今天发现,redis服务器 启动不了了... 下面是 排查/处理过程. 1.查了一遍配置,看了一下前面的博客文章,貌似 这一套流水操作下来应该没问题... 然而,就是起不了... 1.1.安装 ...

  3. .net添加下拉框

    aspx文件 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="DropDownL ...

  4. SVN+Apache域用户认证配置方法_Windows(转，重新排版，部分内容更新优化)

    欢迎和大家交流技术相关问题: 邮箱: jiangxinnju@163.com 博客园地址: http://www.cnblogs.com/jiangxinnju GitHub地址: https://g ...

  5. JS判断数组中是否有重复元素的方法

    判断数组中是否有重复元素,最容易想到的方法是使用2重循环,逐个遍历,比较,但是这个是最慢,最笨的方法,百度得出了更好的方法. var ary = new Array("111",& ...

  6. 解决：Unknown table engine 'InnoDB'

        把查询mysql的结果输出到文件的过程中出现了错误 ERROR 1286 (42000): Unknown table engine 'InnoDB'     这个问题的原因是新版mysql是 ...

  7. sql数剧操作语言

    结构化查询语言SQL(STRUCTURED QUERY LANGUAGE)是最重要的关系数据库操作语言,并且它的影响已经超出数据库领域, 得到其他领域的重视和采用,如人工智能领域的数据检索,第四代软件 ...

  8. php WIN下编译注意问题

    下载VC2012,安装打开CMD 须运行 vcvars32.bat (初始化VC编译环境) 下载PHP WIN编译包:http://windows.php.net/downloads/php-sdk/ ...

  9. 如何有效使用Project（2）——进度计划的执行与监控

    继上次的的<编制进度计划.保存基准>继续讲解如何对计划进行执行和监控. 计划执行即:反馈实际进度.反馈工作消耗(本文只考虑工时,不考虑成本).提出计划变更请求.如果你的企业实施了专门的PM ...

  10. [Android] Web Console: Uncaught TypeError: Object [object Object] has no method 'xxx'

    我们开发的产品,有一部分功能,需要在WebView中打开web页面,然后在web页面中通过js方法回调部分native的功能. 对于web回调native的开发方式,如果不了解的话,可以参考我以前的一 ...