function initPage()

{

btn.onmouseover = buttonOver;

btn.onmouseover = buttonOut;

}

如上，浏览器只会运行指定的最后一个事件处理程序。因为事件处理程序只是属性，一个属性只能有一个值。

用addEventListener()指定多个事件处理程序。

btn.addEventListener(“mouseover”, buttonOver,false);

btn.addEventListener(“mouseover”, buttonOver1,false);

注意：事件属性名与addEventListener（）的事件名不一样，如果事件属性名为onclick或onmouseover,对addEventListener（）而言则是click和mouseover。

不过addEventListener()对IE浏览器不起作用，IE用了一个完全不同的事件模型，attachEvent()。

btn.addEventListener(“onmouseover”, buttonOvere);//这一次事件名前要保留on.

btn.addEventListener(“onmouseover”, buttonOver1);//只有2个参数。

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title></title>

    <script type="text/javascript">

        window.onload = initPage;

        function initPage()

        {

            var inputs = document.getElementsByTagName("input");

            for (var i = 0; i < inputs.length; i++)

            {

                var tt = inputs[i];

                //  tt.addEventListener("blur", showValue, false);

                // tt.addEventListener("change", change, false);

                addEventHandler(tt, "blur", showValue);

                addEventHandler(tt, "change", change);

            }

        }

        function change()

        {

            alert("changed!");

        }

        function showValue()

        {

            switch (this.title)//this指的是调用当前函数的对象，本处即失去焦点的文本框。

            {

                case "name":

                    alert(this.value);

                    break;

                default:

                    alert("pwd");

            }

        }

        // 增加一个工具函数，用于IE或其他浏览器时，多事件程序判断。

        //对象，事件名，处理函数

        function addEventHandler(obj, eventName, handler)

        {

            if (document.attachEvent)

            {

                obj.attachEvent("on" + eventName, handler);

            }

            else if (document.addEventListener)

            {

                obj.addEventHandler(eventName, handler, false);

            }

        }

    </script>

</head>

<body>

    <form id="form1" runat="server">

        <div id="txt">

            <input type="text" id="username" title="name" />

            <input type="text" id="password" title="pwd" />

        </div>

    </form>

</body>

</html>

深入浅出Ajax（四）的更多相关文章

  1. 深入浅出 JMS(四) - ActiveMQ 消息存储

    深入浅出 JMS(四) - ActiveMQ 消息存储 一.消息的存储方式 ActiveMQ 支持 JMS 规范中的持久化消息与非持久化消息 持久化消息通常用于不管是否消费者在线,它们都会保证消息会被 ...

  2. Ajax四步操作

    第一步得到(XMLHttpRequest)function creatXMLHttpRequest(){ try{ return new XMLHttpRequest(); } catch(e){ t ...

  3. 深入浅出JMS(四)--Spring和ActiveMQ整合的完整实例

    第一篇博文深入浅出JMS(一)–JMS基本概念,我们介绍了JMS的两种消息模型:点对点和发布订阅模型,以及消息被消费的两个方式:同步和异步,JMS编程模型的对象,最后说了JMS的优点. 第二篇博文深入 ...

  4. AJAX四种跨域处理方法

    同源策略 同源策略 同源策略限制从一个源加载的文档或者脚本如何与来自另一个源的资源进行交互.这是一个用于隔离潜在恶意文件的关键的安全机制. 具体定义是:一段脚本向后台请求数据,只能读取属于同一协议名. ...

  5. 深入浅出Ajax

    原文(我的GitHub):https://github.com/liangfengbo/frontend-ability/issues/1 学习大纲 理解Ajax的工作原理 Ajax核心-XMLHtt ...

  6. 深入浅出Ajax（五）

    function initPage() { alert("3+3");//3+3 alert(eval("3+3")); //6 //eval()函数可以解析. ...

  7. 深入浅出Ajax（三）

    <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> &l ...

  8. 深入浅出Ajax（二）

    <script type="text/javascript"> window.onload = initPage; function initPage() { var ...

  9. 深入浅出Ajax（一）

    客户端: <script type="text/javascript"> window.onload = initPage; function initPage() { ...

随机推荐

  1. java fork-join框架应用和分析

    http://shmilyaw-hotmail-com.iteye.com/blog/1897636 java fork-join框架应用和分析 博客分类: concurrency multithre ...

  2. hdu_4521_小明系列问题——小明序列(LIS)

    题目连接:http://acm.hdu.edu.cn/showproblem.php?pid=4521 题意:中文题,不解释 题解:这题就是LIS的加强版,可以用二分的nlogn来做,也可以用线段树的 ...

  3. hdu_2147_kiki's game(博弈)

    题目连接:http://acm.hdu.edu.cn/showproblem.php?pid=2147 题意:给你一个矩阵,从右上走到左下,每次只能向左或向下或向斜下走一格,先走到最后一格的会输,问k ...

  4. hdu_1254_推箱子（双BFS）

    题目连接:http://acm.hdu.edu.cn/showproblem.php?pid=1254 题解:以箱子为主体,第一层BFS,然后用第二层BFS来判断人是否可以到达,这里细节比较多,要注意 ...

  5. uci随笔

    UCI : Unified Configuration Interface1.基于nvram配置2.只需修改UCI配置文件3.配置文件存放在路径/etc/config/目录下4.可以通过uci命令或者 ...

  6. 07-09 07:28:38.350: E/AndroidRuntime(1437): Caused by: java.lang.ClassNotFoundException: Didn't find class "com.example.googleplay.ui.activity.MainActivity" on path: DexPathList[[zip file "/data/app/c

    一运行,加载mainActivity就报错 布局文件乱写一通,然后急着运行,报莫名其妙的错误: 07-09 07:28:38.350: E/AndroidRuntime(1437): Caused b ...

  7. 删除sql计划 调用的目标发生了异常。 (mscorlib) 其他信息: 用户 'sa' 登录失败。

    在删除以前创建的sql的计划任务时,弹出如题错误提示,发现错误原因在于,sa密码更改过,导致在删除时因为sa的密码和当前的密码不正确出现此错误. 解决办法: 1.在计划任务的编辑窗口,找到管理连接 2 ...

  8. php 特定类型测试函数

    is_array() 检查变量是否是数组 is_double().is_float().is_real() 检查变量是否是浮点数 is_long().is_int().is_integer()检查变量 ...

  9. $scope

    $scope.aaa = 3; $scope.bbb = 4; $scope.aaa = $scope.bbb; //这只是简单的赋值 $scope.bbb = 5; 输出 $scope.aaa为4 ...

  10. 分页打印控制 摘自于网络：http://www.cnblogs.com/joinger/articles/1807517.html

    代码 style="page-break-after:always;"> 利用CSS控制打印 放在这里,算是一个备份 <style> @media print{ ...