jquery单击事件

jquery单击事件相关知识

• Jquery基础----事件篇

  一、jQuery鼠标事件之click与dbclick事件 click方法用于监听用户单击操作； dbclick方法用于监听用户双击操作。 二、jQuery鼠标事件之mousedown与mouseup事件 mousedown的方法可以监听用户鼠标按下的操作； mouseup方法可以监听用户鼠标弹起的操作。 用event 对象的which区别按键，敲击鼠标左键which的值是1，敲击鼠标中键which的值是2，敲击鼠标右键which的值是3。 三、jQuery鼠标事件之mousemove事件 mousemove事件是当鼠标指针移动时触发的，即使是一个像素； 如果处理器做任何重大
• RecyclerView 的 Item 的单击事件

  RecyclerView 的每个Item的点击事件并没有像 ListView 一样封装在组件中，需要 Item 的单击事件时就需要自己去实现，在 Adapter 中为RecyclerView 添加单击事件参考如下： RecyclerView的使用方法请参考：RecyclerView的简单使用 第一步： 在 RecyclerView 的 Adapyer 中定义单击事件的回调接口： /** * 定义 RecyclerView 选项单击事件的回调接口 */ public interface OnItemClickListener{ //参数（父组件，当前单击的View,单击的View的位置，数据） void onItemCl
• RecyclerView的Item的单击事件

  RecyclerView 的每个Item的点击事件并没有像ListView一样封装在组件中，需要Item的单击事件时就需要自己去实现，在Adapter中为RecyclerView添加单击事件参考如下：RecyclerView的使用方法请参考：RecyclerView的简单使用第一步：在RecyclerView的Adapyer中定义单击事件的回调接口：/**  * 定义RecyclerView选项单击事件的回调接口  */public interface OnItemClickListener{    //参数（父组件，当前单击的View,单击的View的位置，数据）     void onItemClick(RecyclerView parent,View view, int position, String 
• jquery Click事件点击一次，执行多次原因之一

  用jquery  绑定一个按钮click事件后，第一次点击后，一切正常，第二次点击，竟然执行两次，以后越来越多。后来查看文档发现 jquery click  不是 替换原有的function  而是接着添加，所以才会执行次数越来越多。function noteSubmit(contentObj){//点击发送按钮事件$('.noteBtn').on('click',function(){consoel.log("ok");});}一：只执行一次noteSubmit函数二:在函数中加入$('.noteBtn').unbind('click');  function noteSubmit(contentObj){$('.noteBtn').unbind('click');  //点击发送按钮事件$('.noteBtn').

jquery单击事件相关课程

• Android事件分发机制 介绍android系统中关于事件分发的原理，以及流程

  讲师：Sunday 入门 6530人正在学习

• Android流行下拉菜单UI效果 Android仿美团流行下拉菜单实现

  讲师：ALABO 初级 13508人正在学习

• 基于Vue3+Vite+TS，二次封装element-plus业务组件 很多前端开发者只会调用element-plus组件库已有组件，在面对需要定制的场景，或者想要简化使用组件的时候，就会无从下手。本课程深度结合前沿技术栈Vue+Vite+TS，全方位讲解二次封装的思想、技巧、组件设计等，并提供了大量封装实例，帮大家掌握组件的二次封装，实现前端进阶！

  讲师：五月的夏天 中级 296人正在学习

jquery单击事件相关教程

• 1. 什么是 jQuery jQuery 是一个使用 JavaScript 编写的库，可以让开发者用更少的代码来完成业务逻辑。许多年前前端的技术没有现在这么丰富，jQuery 和 JavaScript 也会被经常称为两个技术，因为使用 jQuery 完全可以替代掉使用原生的 JavaScript 操作 DOM、处理动画、处理 AJAX 等，这让两者之间的概念变得模糊。可以对比一下删除一个节点的操作：// 使用JavaScriptvar el = document.getElementById('element');el.parentNode.removeChild(el);// 使用 jQuery$('#element').remove();两者的区别一比较就出来了，jQuery 封装一层 DOM 操作，将原生的 DOM 方法向上层抽象，提供了一套更简洁的 API 来操作 DOM，同时也针对各个浏览器做了兼容性处理，如事件对象、事件的绑定方式等。
• 1. DOM 事件 DOM 事件被发送用于通知代码相关的事情已经发生了。每个事件都是继承自Event 类的对象，可以包括自定义的成员属性及函数用于获取事件发生时相关的更多信息。事件可以表示从基本用户交互到渲染模型中发生的事件的自动通知的所有内容。—— MDNDOM 事件是指给 DOM 节点在触发某个条件下要做的事情，如：当按钮被点击的时候改变背景色。348如上述例子中按钮的 onclick 属性，当他被赋值一个函数的时，这个函数就会在按钮被点击的时候触发。onclick 属性是一种事件处理器属性，表示单击或点击事件，当想指定按钮在被点击的时候要做的事情时，就可以给这个属性赋值。赋值的函数通常被称为事件处理器，即事件被触发时候时候执行的代码块，部分文献中会称为事件处理程序。通常给 DOM 节点设置事件的操作，会被称为绑定事件，上述例子就是给一个按钮绑定了点击事件。绝大部分事件处理器属性都是以 on 开头的。
• 4. 事件修饰符 在事件处理程序中调用 event.preventDefault() 或 event.stopPropagation() 是非常常见的需求。尽管我们可以在方法中轻松实现这点，但更好的方式是：方法只有纯粹的数据逻辑，而不是去处理 DOM 事件细节。为了解决这个问题，Vue.js 为 v-on 提供了事件修饰符。实现方法就是在事件名称后面以后缀的形式添加指定的修饰符。知识扩展：event.preventDefault() 用来取消事件的默认动作。event.stopPropagation() 用来阻止事件冒泡到父元素，阻止任何父事件处理程序被执行。Vue 提供了以下事件修饰符：.stop: 阻止单击事件继续传播；.prevent: 只有修饰符，提交事件不再重载页面；.capture: 添加事件监听器时使用事件捕获模式，即元素自身触发的事件先在自身处理，然后交由内部元素进行处理；.self: 只有在event.target是当前元素自身时触发处理函数，即事件不是从内部元素触发的；.once: 点击事件将只触发一次;.passive: 滚动事件会立即触发，不会等待其他串联事件。即prevent会失效。<!-- 阻止单击事件继续传播 --><a v-on:click.stop="doThis"></a><!-- 提交事件不再重载页面 --><form v-on:submit.prevent="onSubmit"></form><!-- 修饰符可以串联 --><a v-on:click.stop.prevent="doThat"></a><!-- 添加事件监听器时使用事件捕获模式 --><!-- 即内部元素触发的事件先在此处理，然后才交由内部元素进行处理 --><div v-on:click.capture="doThis">...</div><!-- 只当在 event.target 是当前元素自身时触发处理函数 --><!-- 即事件不是从内部元素触发的 --><div v-on:click.self="doThat">...</div><!-- 点击事件将只会触发一次 --><a v-on:click.once="doThis"></a>接下来，我们用一个完整的示例来看下这些修饰符的使用方法。586代码解释：代码第 4-7 行，stop 案例中，当我们给按钮 click 事件添加 .stop 修饰符之后，点击按钮，事件不会向上传递。代码第 10-16 行，submit.prevent 案例中，当给 submit 事件添加 .prevent 修饰符之后，提交事件不再重载页面。代码第 19-21 行，capture 案例中，我们给父容器添加了 capture 事件，当点击按钮的时候，会先触发 capture 中的事件函数，然后再触发按钮绑定的点击事件。代码第 24-26 行，self 案例中，我们给父容器的点击事件添加了 .self 的修饰符，所以只有点击父容器的时候才会触发该方法，当点击按钮的时候并不会触发父容器绑定的事件。代码第 29-31 行，once 案例中，我们给按钮的点击事件添加了 .once 的修饰符，所以只有首次点击按钮的时候会触发事件函数，再次点击之后将不会触发事件函数。
• 1.jQuery Ajax 这个技术在前面章节有独立章节进行讲解。事实上，$.ajax 是基于原生 XMLHttpRequest 进行了封装，并且提供了一套高度统一的设计和编程接口。在我们的代码中，我们一般都这样写：$.ajax({ method: 'POST', url: url, data: data, success: function () {}, error: function () {}});或者结合 deferred 的写法：$.ajax({ url: url, method: 'GET', data : data}).done(data => { // code}).fail(err => { // code})不吹不黑，jQuery 提供的这一套 Ajax 工具方法真的非常优秀，并且经历了这么多年的打磨，其稳定性、成熟度自然不必多言。关于 jQuery 的 Ajax 工具方法的优点，在前面章节已经讲过。至少从使用体验上来讲，简单易用，功能齐全，以至于我身边至今依然有很多开发者在使用这一套工具函数。然而，随着技术的发展，jQuery 也逐步走向一个衰弱的过程。越来越多的前端开发者开始使用诸如 Angular、React 和 Vue 这样的新型框架。想像一下，如果我们在一个基本用不到 jQuery 的技术中进行前端开发，为了要使用 jQuery 的 Ajax 相关方法而强行引入整个 jQuery，这显然是不现实也不可取的。在更新的技术中，我们将寻求体积更小，更为先进的类库。
• 2. 事件监听 在系统发生了一个事件之后，我们如何接收到这个事件呢？这就需要在事件发生之前提前向系统注册一个事件监听器，告诉 Android 系统我关心那些事件，那么系统就会在事件发生的相应时间点给你一个回调通知，常见的事件监听器有以下几个：OnClickListener：用来监听控件的点击事件，即在用户点击某个 View 的时候回调此接口。（这也是开发过程中最最最常见的接口，一定要牢牢掌握！）OnLongClickListener：顾名思义，在 View 被长按的时候回调OnFocusChangeListener：当控件的焦点发生变化的时候回调OnKeyListener：当用户点击手机上的按键的时候回调此接口，通常可以用来拦截按键事件，然后针对特殊场景做特殊处理OnTouchListener：当用户触摸屏幕的时候回调，此接口会发生在OnClickListener回调的前面，所以我们可以在Touch事件进行一些更早期的预处理事务。OnMenuItemClickListener：当用户点击菜单的时候调用以上就是 Android 系统提供的常用事件处理监听器，其中最为常见的就是OnClickListener，未来的开发中会大量的使用到，所以必须掌握。所以接下来会以OnClickListener为例子来演示如何完成事件处理，其他的监听器使用方式也都大同小异。
• 2.3 事件参数 事件参数描述事件发生时的上下文信息，ECharts中不同事件的参数信息相差极大，甚至同种事件在不同组件触发时，回调参数也有差异。2.3.1 鼠标事件参数ECharts 鼠标事件，虽然名称上与 DOM Event 规范 一致，但回调中传递的参数比标准相差很大。以 click 为例，DOM 的 click 事件参数是一个 MouseEvent 对象，主要属性有：{ isTrusted: boolean, screenX: number, screenY: number, clientX: number, clientY: number, ctrlKey: boolean, shiftKey: boolean, altKey: boolean, metaKey: boolean, relatedTarget: object, pageX: number, pageY: number, x: number, y: number, offsetX: number, offsetY: number, ...}可以看出 DOM 的 click 事件参数详细描述了点击行为发生的位置、事件源的 dom、是否带有快捷键、捕获的阶段等。而 ECharts 在 series 上发生的 click 事件带有如下参数：{ // 当前点击的图形元素所属的组件名称， // 其值如 'series'、'markLine'、'markPoint'、'timeLine' 等。 componentType: string, // 图形元素所属二级组件类型 // 如 `bar`、`line`、`pie` 等 componentSubType: string, componentIndex: number, // 系列类型。值可能为：'line'、'bar'、'pie' 等 seriesType: string, // 系列在传入的 option.series 中的 index seriesIndex: number, // 系列ID seriesId: string, // 系列名称 seriesName: string, // 数据名，类目名 name: string, // 触发事件的数据在data数组中的index dataIndex: number, // 触发事件的数据所传入的原始data值 data: number, // sankey、graph 等图表同时含有 nodeData 和 edgeData 两种 data， // dataType 的值会是 'node' 或者 'edge'，表示当前点击在 node 还是 edge 上。 // 其他大部分图表中只有一种 data，dataType 无意义。 dataType: string, // 传入的数据值 value: number | Array, // 数据图形的颜色 color: string, // 数据图形的边框色 borderColor: undefined, // 数据图形的维度信息 dimensionNames: object, encode: object, // 标记信息的html内容 marker: string, $vars: object, // 原始click事件参数 event: object, // 事件名称，本例中为 `click` type: string,}可以看出，ECharts 传递的 click 事件参数侧重于描述发生点击行为的图形所对应的组件信息、状态、配置，比如上例中的 componentType、componentSubType 指明单击的组件类别、子类别；seriesType、seriesIndex、data 等指明单击组件所对应的数据配置值；marker、encode 则指明单击发生时，组件内部状态信息。大多数情况下这些信息是足够使用的，必要时也可以通过 event 属性读取原始 dom 事件参数。需要注意的第二点是，即使是同种事件，不同组件所暴露的参数也是不一样的，以 click 为例，在 series.bar 上触发时有如下属性：componentType、componentSubType、componentIndex、seriesType、seriesIndex、seriesId、seriesName、name、dataIndex、data、dataType、value、color、borderColor、dimensionNames、encode、marker、$vars、event、type在 yAxis 则有：componentType、componentIndex、yAxisIndex、targetType、value、event、type在 title 上则是：componentType、componentIndex、event、typeTips：遗憾的是，官网并未就此给出详细、完整的列表，建议开发时通过 console.log、debugger 等手段获取各种组件所传递的事件参数。2.3.2 行为事件参数与鼠标事件参数一样，行为事件也没有提供一致的参数模型，不过官网提供了 明细说明，开发时建议前往查阅。

jquery单击事件相关搜索

j2ee j2ee是什么 jar格式 java java api java applet java c java jdk java list java map java script java se java socket java swing java switch java web java xml java 程序设计 java 多线程 java 环境变量

查看更多慕课网实用课程