本节目录

----------①鼠标事件

----------②键盘事件

----------③表单事件

----------④文档窗口事件

----------⑤举例，按下回车键触发事件

事件函数

指当THNL文档中发生某些事件时调用的函数方法，通常把事件处理方法放到<head>的jQuery中

常用的事件：

.ready()文档就绪事件

一、鼠标事件

.click()鼠标点击事件

.dbclick()鼠标双击事件

.mouseenter()鼠标穿过时事件

.mouseleave()鼠标离开时事件

.mousemove()鼠标移上时事件

.mouseover()鼠标位于元素上方时事件

.mouseup()鼠标松开事件

.mousedown()鼠标按下事件

二、键盘事件

.keydown()键盘按下事件

.keyup()键盘松开事件

.keypress()只在输入字符时获得事件，每个字符一次事件

三、表单事件

.submit()提交表单时事件

.change()输入域发生变化时事件

.focus()输入框被选中获得焦点时事件

.blur()输入框失去焦点时事件

四、文档窗口事件

.load()指定元素已经加载时事件

.resize()浏览器窗口改变事件

.scroll()可滚动元素滚动时事件（window对象可用）

.unload()离开关闭页面时发生事件

五、按键回车事件

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>无标题文档</title>

<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.0.js">

</script>

<script>

        $(function(){

                document.onkeydown = function(e){

                    var enter = document.all ? window.event : e;

                    //变量ev使用三元运算符定义 判断 ie浏览器？ 结果1=ie浏览器 ： 结果2=e

                    if(enter.keyCode==13) {

                        $("#picture").css({"display":"block"});//处理事件

                    }

                    else{

                        $("#picture").css({"display":"none"});

                    }

                }

        });

</script>

</head>

<body>

    <img src="../../博客/2.jpg" alt="小脸" style="display: none;" id="picture" />

</body>

</html>

早期自学jQuery-二事件的更多相关文章

  1. jQuery(二)事件

    鼠标事件: click dblclick mouseenter:鼠标进入 mouseleave:鼠标离开 hover:鼠标悬停 <!DOCTYPE html> <html> & ...

  2. jQuery:自学笔记(4)——事件与事件对象

    jQuery:自学笔记(4)——事件与事件对象 jQuery中的事件 什么是事件 所谓事件,就是被对象识别的操作,即操作对象队环境变化的感知和反应,例如单击按钮或者敲击键盘上的按键. 所谓事件流,是指 ...

  3. JQuery知识快览之二—事件

    事件是脚本语言的核心.本文将为大家介绍JQuery支持的一些事件和如何自定义事件 JQuery内置事件 1.Document加载事件 JQuery提供了ready,load,unload三个Docum ...

  4. jQuery学习-事件之绑定事件（二）

    在上一篇<jQuery学习-事件之绑定事件(一)>我们了解了jQuery的add方法,今天我们来学习下dispatch方法: dispatch: function( event ) {   ...

  5. HTML 事件(二) 事件的注册与注销

    本篇主要介绍HTML元素事件的注册.注销的方式. 其他事件文章 1. HTML 事件(一) 事件的介绍 2. HTML 事件(二) 事件的注册与注销 3. HTML 事件(三) 事件流.事件委托 4. ...

  6. Jquery的事件操作和文档操作

    对于熟悉前端开发的小伙伴,相信对于Jquery一定不陌生,相对于JavaScript的繁琐,Jquery更加的简洁,当然简洁不意味着简单,我们可以使用Jquery完成我们想要实现全部功能,这里为小白们 ...

  7. 深入学习jQuery鼠标事件

    × 目录 [1]类型 [2]写法 [3]合成事件[4]鼠标按键[5]修改键[6]坐标位置 前面的话 鼠标事件是DOM事件中最常用的事件,jQuery对鼠标事件进行了封装和扩展.本文将详细介绍jQuer ...

  8. 从零开始学习jQuery (五) 事件与事件对象

    本系列文章导航 从零开始学习jQuery (五) 事件与事件对象 一.摘要 事件是脚本编程的灵魂. 所以本章内容也是jQuery学习的重点. 本文将对jQuery中的事件处理以及事件对象进行详细的讲解 ...

  9. 从零开始学习jQuery (二) 万能的选择器

    本系列文章导航 从零开始学习jQuery (二) 万能的选择器 一.摘要 本章讲解jQuery最重要的选择器部分的知识. 有了jQuery的选择器我们几乎可以获取页面上任意的一个或一组对象, 可以明显 ...

  10. jQuery的事件change

    人生还在继续,只有不断补充以前所不懂的知识,今天练习一个jQuery的事件change.这个事件是在对象失去focus并且原本值有所变化时就产生此事件.如select时,用户所选择的选项有变时,或是t ...

随机推荐

  1. echarts双y轴折线图柱状图混合实时更新图

    先看下效果,自己用ps做了张gif图,发现很好玩啊..不喜勿喷 自己下载个echarts.min.js 直接上代码: <!DOCTYPE html><html><head ...

  2. acrgis 解决矢量转栅格分辨率过大造成连续值变离散且出现空白

    目标:解决北京河流矢量polygon 转栅格的问题 设置栅格大小和影像一致30*30----结果发现,因为cell过大,原本连续的是矢量面变得不连续了,特别细的河流会出现间断(如下图所示): 1号 网 ...

  3. Windows系统,Tensorflow的Tensorboard工具细节问题

    随着跟着TensorFlow视频学习,学到Tensorboard可视化工具这里的时候. 在windows,cmd里面运行,tensorboard --logdir=你logs文件夹地址  这行代码,一 ...

  4. 微信小程序富文本中的图片大小超出屏幕

    这个问题我在小程序社区中提的,后来有个帮我回答了这个问题,我试了一下可以. 解决办法是过滤富文本内容,给图片标签添加一个样式,限制图片的最大宽度. replace(/\<img/gi,   '& ...

  5. vue 15分钟倒计时

    HTML: <span>{{minute}}:{{second}}</span> script: 一          二 // 倒计时 num(n) { return n & ...

  6. /etc/profile ~/.bash_profile ~/.bashrc 等文件的执行过程 和 区别

    /etc/profile :系统的所有用户共享 ~/.bash_profile:仅针对当前用户有效 我的电脑只用于开发,因此全部配置/etc/profile 参考链接: https://blog.cs ...

  7. H5入门须知

    ---恢复内容开始--- 首先,让我们来了解一下H5是做什么的,H5全称为“超文本标记语言”.是对网页进行编辑的技术.H5运用Hbulider进行网页编辑.网页可以分为三部分分别是title(主题)u ...

  8. C#高低位分解转换备忘

    private void Form1_Load(object sender, EventArgs e) { , , , , , ); var arr = long2LowHight(time.ToFi ...

  9. 100道JS构造函数面试题

    1. var User = { count: 1, getCount: function () { return this.count; } }; console.log(User.getCount( ...

  10. Anaconda安装python(idea兼容)

    官方网站www.anaconda.com 1 Windos安装 一路下一步,注意添加环境变量 成功过后,测试一下,打开cmd命令行 2 Linux安装 下载完成后上传到linux bash Anaco ...