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

<head>

    <title></title>

    <script src="Jquery/jquery-1.10.2.js" type="text/javascript"></script>

    <script type="text/javascript">

        //<!--当【鼠标按下】的时候触发mousedown事件-->

        $(function () {                              // mousedown 鼠标按下

            $("#btn1").mousedown(function () {

                $("#btn1").val(parseInt($("#btn1").val()) + 1)

            })

        })

        //-----------------------------------------------------------------

        //<!--当【鼠标弹起】的时候触发mouseup事件-->

        $(function () {                              // mouseup 鼠标弹起

            $("#btn2").mouseup(function () {

                $("#btn2").val(parseInt($("#btn2").val()) + 1)

            })

        })

        //******************************************************************

        //<!--当【键盘按下】的时候触发keydown事件-->

        $(function () {                              // keydown 键盘按下

            $("#btn3").keydown(function (e) {

                alert(e.keyCode); //在keydown事件下，keyCody就是当前按键的键盘码 ：打印当前按键的键盘码

                $("#btn3").val(parseInt($("#btn3").val()) + 1)

            })

        })

        //-----------------------------------------------------------------

        //<!--当【键盘按下】的时候触发keypress事件-->

        $(function () {                              // keypress 键盘按下

            $("#btn4").keypress(function (e) {

                alert(e.keyCode)  //在keypress事件下，keyCody就是当前按键的ASCII码 ：打印当前按键的ASCII码

                $("#btn4").val(parseInt($("#btn4").val()) + 1);

            })

        })

        //<!-- KeyDown与keypress是按下一个键的意思, 但实际上二者的根本差别是, 系统由KeyDown返回键盘的代码, 然后由TranslateMessage函数翻译成成字符, 搜索由KeyPress返回字符值. 因此在KeyDown中返回的是键盘的代码。

        //而KeyPress返回的是ASCII字符。KeyPress主要用来接收字母、数字等ASCII字符。KeyPress 仅仅能捕获单个字符,KeyPress 不区分小键盘和主键盘的数字字符。KeyPress 不显示键盘的物理状态（SHIFT键），而仅仅是传递一个字符。KeyPress 将每一个字符的大、小写形式作为不同的键代码解释，即作为两种不同的字符。

//而 KeyDown 和 KeyUP 事件过程能够处理不论什么不被 KeyPress 识别的击键。诸如：功能键（F1-F12）、编辑键、定位键以及不论什么这些键和键盘换档键的组合等。

所以依据你的目的, 假设仅仅想读取字符, 用KeyPress, 假设想读各键的状态, 用KeyDown。假设你一直按着键不放， 这时不断地触发KeyDown和KeyPress-->

        //KeyDown 和KeyUp 区分小键盘和主键盘的数字字符

        //-----------------------------------------------------------------

        //<!--当【键盘弹起】的时候触发keyup事件-->

        $(function () {                              // keyup 键盘弹起

            $("#btn5").keyup(function () {

                $("#btn5").val(parseInt($("#btn5").val()) + 1)

            })

        })

        //******************************************************************

        //<!--当选中控件【获得焦点】的时候-->

        $(function () {                              // focus 获得焦点

            $("#txt1").focus(function () {

                $("#txt1").val(parseInt($("#txt1").val()) + 1)

            })

        })

        //------------------------------------------------------------------

        //<!--当选中控件【失去焦点】的时候-->

        $(function () {                              // blur 失去焦点

            $("#txt2").blur(function () {

                $("#txt2").val(parseInt($("#txt2").val()) - 1)

            })

        })

        //------------------------------------------------------------------

        //<!--当元素的【值发生改变】时，会发生 change 事件-->

        $(function () {                               // change 值发生改变

            $("#txt3").change(function () {

                alert("txt3值发生了变化")

                $(this).css("background", "red")

            })

        })

        //------------------------------------------------------------------

        //<!--当图片载入出错的时候发生error事件 比方找不到图片的地址啊。等等，反正就是没载入上图片-->

        $(function () {                               // error 错误发生

            $("img").error(function () {

                $("img").replaceWith("这个一个图片") //用"这个一个图片" 的文字来替换载入出错的图片

            })

        })

        //------------------------------------------------------------------

        $(document).mousemove(function (e) {           //pageX,pageY 鼠标的坐标

            $("span").text(e.pageX + ", " + e.pageY);

        });

    </script>

</head>

<body>

<p>当鼠标【按下】的时候触发mousedown事件</p>

<input type="button"  value="0" id="btn1"/>

<br/>

<br/>

<hr/>

<p>当鼠标弹起的时候触发mouseup事件</p>

<input type="button"  value="0" id="btn2"/>

<br/>

<br/>

<hr/>

<p>当键盘按下的时候触发keydown事件</p>

<input type="button"  value="0" id="btn3"/>

<br/>

<br/>

<hr/>

<p>当键盘按下的时候触发keypress事件</p>

<input type="button"  value="0" id="btn4"/>

<br/>

<br/>

<hr/>

<p>当键盘弹起的时候触发keyup事件</p>

<input type="button"  value="0" id="btn5"/>

<br/>

<br/>

<hr/>

<p>当控件获得焦点的时候</p>

<input type="text"  value="0" id="txt1"/>

<br/>

<br/>

<hr/>

<p>当控件失去焦点的时候</p>

<input type="text"  value="0" id="txt2"/>

<br/>

<br/>

<hr/>

<p>当元素的值发生改变时。会发生 change 事件。</p>

<input type="text"  id="txt3"/>

<br/>

<br/>

<hr/>

<p>当元素的值发生改变时，会发生 change 事件。</p>

<br/>

<br/>

<hr/>

<p>找不到图片地址，图片就不能正常载入，图片载入错误就会触发orrer事件</p>

<img src=""/>

<br/>

<br/>

<hr/>

<p>span标签用来显示鼠标的横纵坐标的值</p>

<span></span>

</body>

</html>

jquery事件 【mousedown与mouseup ----keydown与keypress与keyup】focus--blur--orrer--pageX-pageY的更多相关文章

  1. 键盘事件keydown、keypress、keyup随笔整理总结（摘抄）

    原文1:http://www.cnblogs.com/silence516/archive/2013/01/25/2876611.html 原文2:http://www.cnblogs.com/leo ...

  2. 键盘事件keydown、keypress、keyup随笔整理总结

    英文输入法:   事件触发顺序:keydown - > keypress - > keyup   中文输入法:   firfox:输入触发keydown,回车确认输入触发keyup chr ...

  3. 键盘事件keydown、keypress、keyup

    事件触发顺序:keydown - > keypress - > keyup   中文输入法:   firfox:输入触发keydown,回车确认输入触发keyup chrome:输入触发k ...

  4. JQuery使用mousedown和mouseup简单判断鼠标按下与释放位置是否相同

    在JQuery中,我们可以利用mousedown.mouseup来跟踪页面的鼠标按下与释放事件. 如何获取鼠标的位置信息呢?事件event的pageX和pageY属性可以让我们获得鼠标在页面中的具体位 ...

  5. 详解键盘事件(keydown，keypress，keyup)

    一.键盘事件基础 1.定义 keydown:按下键盘键 keypress:紧接着keydown事件触发(只有按下字符键时触发) keyup:释放键盘键 顺序为:keydown -> keypre ...

  6. Winform下KeyDown，KeyPress，KeyUp事件的总结(转)

    原文: http://www.cnblogs.com/xiashengwang/archive/2011/09/15/2578798.html 在winform程序中,经常会用到这几个事件用于控制数字 ...

  7. C#控件中的KeyDown、KeyPress 与 KeyUp事件浅谈

    研究了一下KeyDown,KeyPress 和 KeyUp 的学问.让我们带着如下问题来说明: 1.这三个事件的顺序是怎么样的? 2.KeyDown 触发后,KeyUp是不是一定触发? 3.三个事件的 ...

  8. javascript简单拖拽(鼠标事件 mousedown mousemove mouseup)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xht ...

  9. C#学习笔记-KeyDown、KeyPress、KeyUp事件以及KeyCode、KeyData、KeyValue、KeyChar属性

    本来没打算单独写的,但是在自己弄测试小程序的时候,越写发现不清楚的东西越多,所以实践又一次证明:纸上得来终觉浅,绝知此事要躬行! 直接贴代码了: //发生顺序:KeyDown->KeyPress ...

随机推荐

  1. Android之Http通信——1.初识Http协议

    Android之Http通信--1.初识Http协议 引言: 今天是六一儿童节,先在这里给各位超龄儿童说声节日快乐哈~( ╯□╰ ),小猪也象征性地给群里的小朋友们派了红包-嗯,忙碌的五月最终过去了, ...

  2. Android Application 类共享全局数据

    android系统会为每一个程序执行时创建一个Application类的对象且仅创建一个.所以Application能够说是单例模式的一个类.且application对象的生命周期是整个程序中最长的, ...

  3. 使用iOS原生sqlite3框架对sqlite数据库进行操作

    摘要: iOS中sqlite3框架可以很好的对sqlite数据库进行支持,通过面向对象的封装,可以更易于开发者使用. 使用iOS原生sqlite3框架对sqlite数据库进行操作 一.引言 sqlit ...

  4. 语法错误: unexpected ''); ?></span></span></h2> ' (T_CONSTANT_ENCAPSED_STRING), expecting ',' or ';'

    语法错误: unexpected ''); ?></span></span></h2>' (T_CONSTANT_ENCAPSED_STRING), expe ...

  5. 37.创建自定义的指令的限制使用 通过restrict 设置

    转自:https://www.cnblogs.com/best/tag/Angular/ 1. 元素名 <runoob-directive></runoob-directive> ...

  6. Python有了asyncio和aiohttp在爬虫这类型IO任务中多线程/多进程还有存在的必要吗？

    最近正在学习Python中的异步编程,看了一些博客后做了一些小测验:对比asyncio+aiohttp的爬虫和asyncio+aiohttp+concurrent.futures(线程池/进程池)在效 ...

  7. UVa 10305 Ordering Tasks【拓扑排序】

    题意:给出n件事情,m个二元组关系,求它们的拓扑序列 用的队列来做 #include<iostream> #include<cstdio> #include<cstrin ...

  8. 51Nod 不重叠的线段（贪心）

    X轴上有N条线段,每条线段有1个起点S和终点E.最多能够选出多少条互不重叠的线段.(注:起点或终点重叠,不算重叠). 例如:[1 5][2 3][3 6],可以选[2 3][3 6],这2条线段互不重 ...

  9. Out-of-Process iframes (OOPIFs)

    For Developers‎ > ‎Design Documents‎ > ‎ Out-of-Process iframes (OOPIFs) This page provides an ...

  10. NodeJS学习笔记 (25)逐行读取-readline(ok)

    模块概览 readline是个非常实用的模块.如名字所示,主要用来实现逐行读取,比如读取用户输入,或者读取文件内容.常见使用场景有下面几种,本文会逐一举例说明. 文件逐行读取:比如说进行日志分析. 自 ...