首页
学习
活动
专区
圈层
工具
发布

WEB入门之十四 jQuery事件

松开键盘时发生的事件 keypress( [ [data] , fn ] ) 按下并松开键盘时发生的事件 mousedown( [ [data] , fn ] ) 按下鼠标按钮时发生的事件 mousemove...表5-1-2 jQuery鼠标事件 鼠标事件 说明 mousedown( [ [data] , fn ] ) 按下鼠标按钮时发生的事件 mousemove( [ [data] , fn ] ) 鼠标移动时发生的事件...当按下鼠标左键时记录鼠标位置作为起始位置;当鼠标移动时一直记录鼠标的当前位置;当松开鼠标左键时记录鼠标位置作为结束位置。...jQuery在遵循W3C规范的情况下,对event对象做了进一步封装,使得该对象在各大浏览器下都可以正常运行。...3表示鼠标右键 pageX/Y 获取事件发生时相对于页面的坐标 keyCode 获取在键盘事件中键盘对应的键值 screenX/Y 获取事件发生时相对于屏幕的坐标 data 事件发生时传递的参数的信息都保持在该属性中

1K10

WEB入门之十四 jQuery事件

松开键盘时发生的事件 keypress( [ [data] , fn ] ) 按下并松开键盘时发生的事件 mousedown( [ [data] , fn ] ) 按下鼠标按钮时发生的事件 mousemove...表5-1-2 jQuery鼠标事件 ​鼠标事件​ ​说明​ mousedown( [ [data] , fn ] ) 按下鼠标按钮时发生的事件 mousemove( [ [data] , fn ] )...当按下鼠标左键时记录鼠标位置作为起始位置;当鼠标移动时一直记录鼠标的当前位置;当松开鼠标左键时记录鼠标位置作为结束位置。...jQuery在遵循W3C规范的情况下,对event对象做了进一步封装,使得该对象在各大浏览器下都可以正常运行。...;值3表示鼠标右键 pageX/Y 获取事件发生时相对于页面的坐标 keyCode 获取在键盘事件中键盘对应的键值 screenX/Y 获取事件发生时相对于屏幕的坐标 data 事件发生时传递的参数的信息都保持在该属性中

1.1K10
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    JQuery基础概念知识

    jQuery的语法设计可以使开发者更加便捷,例如操作文档对象、选择DOM元素、制作动画效果、事件处理、使用Ajax以及其他功能。除此以外,jQuery提供API让开发者编写插件。...AJAX:即“Asynchronous Javascript And XML”(异步JavaScript和XML),可以不刷新页面完成数据库操作(包括查询并返回数据),在验证输入时有很重要的作用。...,提高了开发效率;强大的DOM、CSS事件处理操作能力;使代码更加简洁;减弱了与浏览器的相关性;提高了运行效率; 下载地址:http://docs.jquery.com/Downloading_jQuery...使用 jQuery的Id选择器;jQuery的事件方法;修改样式函数css();修改属性函数attr(); 新建一个html文档 <!...; 标签中的type类型”reset”是重置form标签之间文本框中输入的数据为空; 中的action属性标示了按下提交按钮后的跳转,可以是一个简单的网址,也可以是一个action

    1.4K10

    硬核解析,巧用案例学习jQuery框架三种事件绑定方式

    在jquery框架的使用中,难免会遇到按钮或文本框等各种各样的要求要进行相应事件的绑定操作,进行事件的绑定能够增加页面的交互效果,相信在html和js中进行事件的绑定大家都不陌生,那么今天我就来和小伙伴们分享一下利用...Jquery中有三种基本的事件绑定方式,那么我们就以三个小案例的形式来分别和大家讲一下这三种基本的事件绑定方式。...一、 jquery标准的绑定方式 Jquery框架的标准绑定的语法是: jq对象.事件方法(回调函数); 如: Jquery对象.cilck();点击事件 Jquery对象.mouseover();鼠标移入时触发...如下面的实例:鼠标移入时触发弹窗,移出时再触发弹窗事件。 下大家:1.9版本 .toggle() 方法删除,jQuery Migrate(迁移)插件可以恢复此功能。在中添加以下代码即可添加插件: script src="..

    2.4K10

    全网最新、最全的jQuery核心知识,你真的不想点开看看嘛?

    大多数情况下你无需直接操作该函数,除非你需要操作不常用的选项,以获得更多的灵活性。话不多说,接下来详细给大家介绍jQuery核心知识。...DOM 对象可以使用 JavaScript 中的方法。比如:网页中的按钮、文本、盒子等等... 6....一般情况下,在命名jQuery对象时,为了与DOM对象进行区分,习惯性的以 开头,这不是必须的。...例如:给id是btn的按绑定单击事件 $("#btn").click(function(){ ​ alert("btn按钮单击了"); }) 12.2 on 事件绑定 on() 方法在被选元素上添加事件处理程序...使用jQuery以及Ajax实现省市级联查询 使用的地方:比如填写淘宝收货地址的时候,在省份来点击河北省,下一个市区栏会自动变为河北省以下的市区名,选择好市区名下一栏会出现该市区内的街道等信息 我们这里使用一下

    7.1K10

    JavaScript学习笔记(四)—— jQuery入门

    终于到了js框架的学习部分了,这部分内容主要讲jQuery,也是非常重要的内容。 jQuery应用入门 jQuery是一个JavaScript库,极大的简化了JavaScript编程。...,即type="button"的input元素 :submit 选择所有的提交按钮 :reset 选择所有的重置按钮 :text 选择所有的单行文本框 :image 选择所有的图像域 :hidden 选择所有的隐藏域...触发方式 返回值 keydown 在键盘上按下某键时触发,一直按一直触发 返回键盘代码 keypress 在键盘上按下一个能产生字符的按键时触发 返回ASCII码 keyup 松开某一键时触发 返回键盘代码...jQuery的事件处理 1. jQuery常用的事件方法 鼠标操作事件 方法 描述 mousedown() 鼠标的键被按下 mouseenter() 当鼠标指针进入目标时 mouseleave()...绑定与接触事件 绑定事件 绑定事件就是将页面中的元素事件类型与其在收到该事件之后期望进行的操作联系到一起。

    11.8K50

    与Ajax同样重要的jQuery(2)

    练习5: ² 在id=edu下增加大专 javascript" src=".....5.jQuery事件 ①:事件绑定 传统js 一般一个对象只能绑定某种事件一个函数 jQuery 支持对同一个对象,同一个事件可以绑定多个函数 绑定事件函数到对象有两种写法 写法一 $("div").click...练习1: ² 为页面内所有p 元素绑定 一次性事件,点击打印p元素中内容 ² 页面内有两个按钮,点击按钮1, 触发按钮2的 click事件执行 javascript.../jquery-1.8.3.min.js"> javascript"> $(function(){ //为页面内所有p 元素绑定 一次性事件,点击打印...p元素中内容 $("p").one("click",function(){ alert($(this).text()); }); //页面内有两个按钮,点击按钮1, 触发按钮2的 click事件执行 $

    6.8K50

    「jQuery」基础 - 02

    (该方法也可以获取 H5 自定义属性) 1.1.3 数据缓存 data() data() 方法可以在指定的元素上存取数据,并不会修改 DOM 元素结构。一旦页面刷新,之前存放的数据都将被移除。...把全选按钮状态赋值给3小复选框就可以了。 当我们每次点击小的复选框按钮,就来判断。 如果小复选框被选中的个数等于3 就应该把全选按钮选上,否则全选按钮不选。...对文本框的数字进行限制,不能小于0....案例:品优购电梯导航(下) 当我们点击电梯导航某个小li, 当前小li 添加current类,兄弟移除类名 当我们页面滚动到内容区域某个模块, 左侧电梯导航,相对应的小li模块,也会添加current类...触发的事件是页面滚动,因此这个功能要写到页面滚动事件里面。 需要用到each,遍历内容区域大模块。

    3.4K20

    「jQuery」基础 - 03

    案例:发布微博案例 点击发布按钮, 动态创建一个小li,放入文本框的内容和删除按钮, 并且添加到ul 中。 点击的删除按钮,可以删除当前的微博留言。 jQuery 为我们提供 了多种事件解绑方法:die()、undelegate()、off()等,甚至还有只触发一次的事件绑定方法one(),在这里我们重点讲解一下off(): off语法 演示代码...事件处理 trigger() 自动触发事件 有些时候,在某些特定的条件下,我们希望某些事件能够自动触发, 比如轮播图自动播放功能跟点击右侧按钮一致。...jQuery 多库共存 实际开发中,很多项目连续开发十多年,jQuery版本不断更新,最初的 jQuery 版本无法满足需求,这时就需要保证在旧有版本正常运行的情况下,新的功能使用新的jQuery版本实现...综合案例: toDoList案例分析 1.7.1 案例:案例介绍 文本框里面输入内容,按下回车,就可以生成待办事项。 点击待办事项复选框,就可以把当前数据添加到已完成事项里面。

    3.4K30

    前端架构师之01_JQuery

    ,function) 在父元素上检测子元素失去焦点的情况 表单事件 select([[data],function]) 当文本框(包括和)中的文本被选中时触发 表单事件...submit([[data],function]) 当表单提交时触发 键盘事件 keydown([[data],function]) 键盘按键被按下时触发 键盘事件 keypress([[data],...function]) 键盘按键(Shift等非字符键除外)被按下时触发 键盘事件 keyup( [[data],function ]) 键盘按键被松开时触发 鼠标事件 mouseover([[data]...中的ready与JavaScript中的onload相比,不仅可以在页面加载后立即执行,还允许注册多个事件处理程序。...clearQueue] [, jumpToEnd]) 停止所有在指定元素上正在运行的动画 参数params表示一组包含动画最终属性值的集合。

    1.7K00

    最新jquery+easyui_api培训文档

    $.messager.prompt title, msg, fn 显示一个确定和取消按钮的信息提示窗口,提示用户输入一些文本。参数如下:title:显示在标题面板的标题文本。...validate none 做验证以确定文本框的内容是否是有效的。...布尔 定义是否显示刷新按钮 true beforePageText 字符串 在输入框组件前显示的标签 Page afterPageText 字符串 在输入框组件后显示的标签 Of  {pages} displayMsg...false fit 布尔 如果为ture则设置标签的大小以适应它的容器的父容器 false border 布尔 如果为true则显示标签容器的边框 true scrollIncrement 数字 滚动按钮每次被按下时滚动的像素值...100 scrollDuration 数字 每次滚动持续的毫秒数 400 11.3 事件 事件名 参数 描述 onLoad arguments 当一个AJAX标签加载远程数据完成时被触发,参数和jQuery.ajax

    3.9K40

    JS 检测各种不同的鼠标点击事件方法

    日常开发中,我们一般只需要考虑鼠标左键单击事件。但实际上,鼠标不只有左键单击一种事件,在复杂需求下,我们可能需要检测各种不同的鼠标点击事件,比如:鼠标右键单击或者中键(滚轮)单击等事件。...本文将分享 javascript 中检测各种鼠标按键的点击事件,包括左键、右键、中键等。...它返回一个数字,表示哪个按钮被按下:0:左键1:中间按钮(滚轮按钮)2:右键3:浏览器后退按钮(并非始终支持)4:浏览器前进按钮(并非始终支持)创建事件监听器要检测各种鼠标点击,首先需要为鼠标点击事件设置一个事件监听器...document.addEventListener('mousedown', function(event) { console.log(`鼠标按钮被按下: ${event.button}`);}...);检测特定的鼠标点击按钮在事件监听器回调函数中,可以使用event.button属性来确定按下的鼠标按钮,并根据按钮执行不同的操作。

    1.1K10

    前端成神之路-03_jQuery

    案例:发布微博案例 1.点击发布按钮, 动态创建一个小li,放入文本框的内容和删除按钮, 并且添加到ul 中。 2.点击的删除按钮,可以删除当前的微博留言。 ​ 代码实现略。...jQuery 为我们提供 了多种事件解绑方法:die() / undelegate() / off() 等,甚至还有只触发一次的事件绑定方法 one(),在这里我们重点讲解一下 off() ; 语法...事件处理 trigger() 自动触发事件 ​ 有些时候,在某些特定的条件下,我们希望某些事件能够自动触发, 比如轮播图自动播放功能跟点击右侧按钮一致。...多库共存 ​ 实际开发中,很多项目连续开发十多年,jQuery版本不断更新,最初的 jQuery 版本无法满足需求,这时就需要保证在旧有版本正常运行的情况下,新的功能使用新的jQuery版本实现,这种情况被称为...文本框里面输入内容,按下回车,就可以生成待办事项。 // 2. 点击待办事项复选框,就可以把当前数据添加到已完成事项里面。 // 3. 点击已完成事项复选框,就可以把当前数据添加到待办事项里面。

    3.4K20

    Window对象

    Window对象 window作为全局变量,代表了脚本正在运行的窗口,将属性与方法暴露给JavaScript。 Window对象属性 closed: 表示所引用的窗口是否关闭。...onerror: 当发生JavaScript运行时错误与资源加载失败时触发。 onabort: 发送到window的中止abort事件的事件处理程序,不适用于Firefox 2或Safari。...onsubmit: 窗口内表单中submit按钮被按下触发。 onhashchange: 当窗口的锚点哈希值发生变化时触发。 鼠标相关 onclick: 当点击页面时触发。...ondblclick: 当双击页面时调用事件句柄。 oncontextmenu: 在点击鼠标右键打开上下文菜单时触发。 onmousedown: 鼠标按钮被按下时触发。...onauxclick: 指示在输入设备上按下非主按钮时触发,例如鼠标中键。 键盘相关 onkeydown: 某个键盘按键被按下时触发。 onkeyup: 某个键盘按键被松开后触发。

    3K20

    一个小时学会jQuery

    jQuery1.7 (2011年11月04号):新版本包含了很多新的特征,特别提升了事件委派时的性能尤其是在IE7下。...在Chrome浏览器按Ctrl+Shift+I启动开发者工具,调试上面的代码,添加监视foo对象,在右侧展开监视的foo对象,可以看到该DOM对象的所有属性、方法与事件信息。...,触发 blur事件 $("button").mousedown()//当按下鼠标时触发事件 $("button").mouseup() //节点上放松鼠标按钮时触发事件 $("p").mousemove...$(window).keydown() //当键盘或按钮被按下时触发事件 $(window).keypress() //当键盘或按钮被按下时触发事件,每输入一个字符都触发一次 $("input").keyup...event.type   //事件的类型 event.which   //按下了哪一个键 event.data   //在事件对象上绑定数据,然后传入事件处理函数 event.target  //事件针对的网页节点

    20.6K71

    用户浏览器操作行为的一种记录方法

    内的各类事件相关函数进一步实现对于用户操作行为的记录。...: (1)在元素内增加onclick属性; (2)通过对元素添加addEventListener实现click事件后的回调函数处理; (3)通过如JQuery框架实现click事件处理。..." src="jquery-1.11.1.min.js"> javascript" src="shadow.core.js">...>javascript" src="shadow.core.element.js"> 接下来,我们可以打开控制台依次点击按钮,查看效果...按我们的意图可以实现对点击按钮用户操作行为的记录,并转换为自然语言通过控制台输出了,最后需要解决的问题是如何透明地将我们的两个JavaScript脚本注入到所访问的HTML网页内,使用非透明代理方式附加额外的服务

    2.2K41
    领券