jQuery jQuery速成 - 键盘事件

[复制链接]
攻城狮 发表于 2015-9-12 15:19:04 [jQuery] 显示全部楼层 |阅读模式 上一主题 下一主题

马上注册,一起探讨正确快速的建站方法

您需要 登录 才可以下载或查看,没有帐号?快速注册

x
这节我们来讲解下jQuery键盘事件相关知识

键盘按下:

$("Element").keydown()
当键盘按下的时候触发此事件。

$("Element").keydown(function)
当键盘按下的时候触发此事件,并绑定一个处理方法。

键盘敲击:

$("Element").keypress()
当键盘按下的时候触发此事件。

$("Element").keypress(function)
当键盘按下的时候触发此事件,并绑定一个处理方法。

注:虽然从表面上理解keypress与keydown是一个意思,但二者的本质区别是:系统由keydown返回键盘的代码, 然后由TranslateMessage函数翻译成字符, 由keypress返回字符值. 因此在keydown中返回的是键盘的代码, 而keypress返回的是ASCII字符. 所以根据你的目的, 如果只想读取字符, 用keypress, 如果想读各键的状态, 用keydown。

键盘弹起:

$("Element").keyup()
当键盘按键释放的时候触发。

$("Element").keyup(function)
当键盘按键释放的时候触发并绑定一个处理方法。

课后作业:

注:本节课后作业可以对前几节的内容进行回顾,并且可以使大家能够快速的将讲过的方法融合在一起使用,更好的驾驭jQuery!
作业1:
      页面上有一个文本域并有一段文字,当失去焦点的时候在旁边“比如div span等”显示有多少个字。
作业2:
      页面中有一个文本域,当在页面上输入文字的时候,在上方显示“正在输入”的字样,并以蓝色字体显示,停止输入的时候上方无任何文字。

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3.     <head>
  4.         <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5.         <title>第二十二节jQuery作业-站帮网zb7.com</title>
  6.         <script language="javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.js"></script>
  7.         <script language="javascript" charset="GB2312">
  8.          此处编写jQuery代码
  9.         </script>
  10.         <style>
  11.          如有需要,此处编写CSS代码
  12.         </style>
  13.     </head>
  14.     <body>
  15.      如有需要,此处编写HTML代码
  16.     </body>
  17. </html>
复制代码







上一篇:jQuery速成 - 焦点事件
下一篇:jQuery速成 - 其他事件
您需要登录后才可以回帖 登录 | 快速注册

本版积分规则

快速回复 返回顶部 返回列表