Jquery4事件bind()、事件冒泡、更换网页背景颜色、菜单的展开和收缩

最新推荐文章于 2023-06-09 15:05:07 发布
最新推荐文章于 2023-06-09 15:05:07 发布
阅读量296 收藏
点赞数
文章标签： jquery html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/l3579/article/details/108873996
版权
本文深入探讨了jQuery的bind()方法在事件处理中的应用，阐述了事件冒泡的概念，并展示了如何通过jQuery改变网页背景颜色及实现菜单的动态展开和收缩效果。通过这些实例，读者将更好地理解DOM交互和前端开发中的事件处理策略。
摘要由CSDN通过智能技术生成

Jquery4事件bind()、事件冒泡、更换网页背景颜色、菜单的展开和收缩

事件bind()

jQuery 事件：
jQuery 是为事件处理特别设计的。
什么是事件？
页面对不同访问者的响应叫做事件。
事件处理程序指的是当 HTML 中发生某些事件时所调用的方法。
实例：

  • 在元素上移动鼠标。
  • 选取单选按钮
  • 点击元素

在事件中经常使用术语"触发"（或"激发"）例如：“当您按下按键时触发 keypress 事件”。

bind()定义和用法

bind() 方法向被选元素添加一个或多个事件处理程序，以及当事件发生时运行的函数。

在这里插入图片描述

在这里插入图片描述

事件冒泡

在这里插入图片描述

事件冒泡转载链接

更换网页背景颜色

在这里插入图片描述

菜单的展开和收缩

在这里插入图片描述

l3579
关注
jQuery中事件的绑定和解绑以及事件冒泡和事件冒泡的阻止
dwjdj的博客
05-08 359
一、元素事件的绑定 为按钮绑定鼠标进入,鼠标离开,点击事件 第一种方法 $("#btn").mouseenter(function () { $(this).css("backgroundColor","red"); }); $("#btn").mouseleave(function () { $(this).css("backgroundColor","blue");
2021-07-29 vue事件冒泡和事件捕获,阻止冒泡和阻止浏览器默认行为
GAARA
07-29 2107
文章目录0.概要1.事件冒泡和事件捕获1.1.事件冒泡例子1.2.事件捕获例子2.阻止冒泡和阻止默认行为例子 0.概要 1.阻止冒泡:@click.stop=‘fn’ 2.阻止浏览器的默认行为:@click.prevent=‘fn’ 3.事件捕获:@click.capture=‘fn’ 1.事件冒泡和事件捕获 1.1.事件冒泡例子 html: <div id="app"> <div id="car" @click="type('车')"> <div id="benzcar
多点触控之MotionEvent.ACTION_MASK作用
weixin_30642561的博客
04-22 186
ACTION_MASK在Android中是应用于多点触摸操作，字面上的意思大概是动作掩码的意思吧。 在onTouchEvent(MotionEventevent)中，使用switch(event.getAction())可以处理ACTION_DOWN和ACTION_UP事件； 使用switch(event.getAction()&MotionEvent.ACTION_M...
事件冒泡机制与委托机制，jQuery动态绑定
大漠雁
12-07 5351
一次事件的完整过程包括三步：捕获 执行目标元素的监听函数 冒泡 事件冒泡机制与委托机制，jQuery动态绑定
深入理解jQuery中的事件冒泡
03-12 493
1.什么是冒泡eg： <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>事件冒泡</title> <scrip
网页 阻止冒泡
banzi2045的博客
03-30 80
event.stopPropagation(); 转载于:https://www.cnblogs.com/panlaixing/p/8675490.html
关于jquery input textare 事件绑定及用法学习
12-08
(1)jquery 绑定事件 目前1.7以上，jquery的事件绑定已经用on替换了原来的bind； 区别：(个人理解)bind是一次绑定事件到每一个子节点；on是只绑定到父节点，然后冒泡到各个子节点； 用法：bind 一个事件，一个方法：$...
JQuery中DOM事件冒泡实例分析
12-29
本文实例分析了JQuery中DOM事件冒泡。分享给大家供大家参考。具体分析如下： 什么是冒泡 在页面上可以有多个事件，也可以多个元素响应同一个事件。假设网页上有两个元素，其中一个元素嵌套在另一个元素里，并且都被...
jQuery文本框(input textare)事件绑定方法教程
01-21
jquery​的事件绑定已经用on替换了原来的bind，接下来为大家介绍下bind的使用方法及input textare事件，感兴趣的朋友可以参考下 (1)jquery 绑定事件 目前1.7以上，jquery的事件绑定已经用on替换了原来的bind；...
jQuery点击其他地方时菜单消失的实现方法
01-19
本文实例讲述了jQuery点击其他地方时菜单消失的实现方法。分享给大家供大家参考，具体如下： [removed] function stopPropagation(e) { if (e.stopPropagation) e.stopPropagation();//停止冒泡 非ie else e....
深究html页面的事件的捕获和冒泡的问题
milijiangjun的博客
02-22 428
不知道我什么时候从网上截得图了。此为别人的图，特此声明。
多点触控之MotionEvent.ACTION_MASK的作用
baidu_24743861的博客
07-08 969
多点触控之MotionEvent.ACTION_MASK的作用
Android 屏幕操作原理
crasheye的博客
05-05 1051
给大家介绍下AndroidonTouchEven的实现原理以及调用流程 android Activity或View 里有 onTouchEvent() 事件，当我们对手机的屏幕进行操作，如点击、移动、抬起，都会触发 onTouchEvent 事件
View的事件分发机制
最新发布
qq_40194724的博客
06-09 561
从用户手指点击屏幕到抬起之间的一系列动作就是事件。具体查看类。事件分发就是分发的过程，当系统产生一个后，系统需要把这个事件传递到具体的View，这就是事件分发过程。
android多点触控统一的原理(使用 event.getAction()&MotionEvent.ACTION_MASK的原因)
fancychendong的专栏
08-15 1万+
看到下面代码中用了AND位运算是为了什么呢？ public boolean onTouchEvent(MotionEvent event) { int action = event.getAction(); switch (action & MotionEvent.ACTION_MASK) { case MotionEvent.ACTION_DOWN:
Android滑动冲突解决方案内外部拦截法及原理
LJ_GOD的博客
01-11 4926
本文接上篇Android滑动冲突一内部拦截外部拦截简介 一 ViewPager嵌套ListView的滑动冲突，内部拦截法为何ViewPager的onInterceptTouchEvent要做判断而不是直接返回true？ 我们重温下Android事件分发二之ViewGroup如何处理事件中ViewGroup事件分发方法的源码。注意这个ViewGroup对应到我们例子的ViewPager class:ViewGroup: @Override public boolean dispa.
Android多点触控之——MotionEvent(触控事件)
热门推荐
David-Kuper的专栏
12-23 1万+
今天晚上刚学习了一个多点触控的小程序，后面想对其做一个定制。在写的时候遇到很多问题，于是乎就查了一下API文档，又到网上查了一下高手的文章，最后自己又实践了一下。终于把多点触控事件监听的大概原理给弄清楚了。下面就写一下我个人对多点触控原理的理解： 一、MotionEvent事件的分类       触控分为两类：单点触控和多点触控。       1、如何获取触控事件信息？         安
MotionEvent的getAction、getActionMask和getActionIndex的区别
Running&H的博客
09-13 524
JQuery事件与动画实战：bind应用与动态样式
"本文主要介绍了JQuery中的事件绑定和动画效果的实现，通过实例代码进行讲解，包括bind事件的使用以及CSS方法动态设置元素样式，同时展示了按钮点击切换内容显示和隐藏的实现方式。" 在JavaScript库JQuery中，事件...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值