jQuery用unbind方法去掉hover事件及其他方法介绍
近日项目开发十分的繁忙,其中一个需求是实现响应式导航。(响应式的问题我们在css相关的博客中再交流)
大家都知道导航是需要下来菜单效果的,必然就会用到 jQuery的 hover() 方法。若是导航放在ipad中,自然hover()就没有什么意义了。那该如何取消hover()并添加touch事件呢?
今天遇到jquery需要去掉hover的问题,原以为直接unbind(“hover”)就可以搞定,可是搞了半天都报错。
原因其实很简单,hover并不是事件。打开参考手册,hover其实由 mouseenter和mouseleave构成的。这样问题就很明了!
/* 这种方法是错误的 */
$(#hover_div).unbind("hover"); /* 这种方法也是错误的 */
$(#hover_div).unbind("mouseover").unbind("mouseout"); /* 这种方法是新增的,在老的版本里是无法使用的 */
$(#hover_div).unbind("mouseenter mouseleave"); /* 这种方法正确的,新老版本皆可用 */
$(#hover_div).unbind("mouseenter").unbind("mouseleave");
上面的代码建议使用第四种,相对安全些。(自己也没测试具体哪些版本支持第三种方法)若是觉得不爽,自己刚download了新版的jQuery,就用第三种吧!
不管怎样,问题已解决,接着写代码吧!勤劳的码农。
jQuery用unbind方法去掉hover事件及其他方法介绍的更多相关文章
- jquery中取消和绑定hover事件的正确方式
在网页设计中,我们经常使用jquery去响应鼠标的hover事件,和mouseover和mouseout事件有相同的效果,但是这其中其中如何使用bind去绑定hover方法呢?如何用unbind取消绑 ...
- jQuery的live()方法对hover事件的处理示例
hover([over,]out) 一个模仿悬停事件(鼠标移动到一个对象上面及移出这个对象)的方法 当鼠标移动到一个匹配的元素上面时,会触发指定的第一个函数. 当鼠标移出这个元素时,会触发指定的第二个 ...
- jQuery 的 live() 方法对 hover 事件的处理
因为hover不是标准的事件,因此无法直接使用live进行处理,故使用以下方法代替,效果一样 <script type="text/javascript"> $(&qu ...
- jquery hover事件冒泡解决方法
$(this).hover(function(event){ $(this).addClass("cur"); event.stopPropagation(); ...
- 处理jQuery append加入的元素 绑定事件无效的方法
通过jquery append(或者before.after,一样)新添加进网页的元素,常用的事件不能触发,比如:append了id 为 abc 的元素,那么 $(#abc).click(functi ...
- 解决使用jQuery采用append添加的元素事件无效的方法
<html> <head> <script type="text/javascript" src="/jquery/jquery.js&qu ...
- 利用javascript动态加载头部出现点击事件与hover事件无效解决方法
这里是利用es6的promise函数来异步加载,当HTML动态加载过去的HTML片段加载完毕再执行绑定事件的js代码: 具体过程如下 这里是用了jQuery框架的例子 $(function(){ // ...
- 使用jQuery的hover事件在IE中不停闪动的解决方法
在使用jQuery的hover事件时,经常会因为鼠标滑动过快导致菜单不停闪动的情况,相信很多朋友都遇到过自己做的纵向下拉菜单不停的收缩,非常的讨厌.今天在给一个网站设计菜单时也遇到了这个情况,结果在百 ...
- JQuery触发hover事件无效时使用js原生的触发事件方法
需求:在开发一个从微信公众号后台管理网页上爬取数据的chrome插件时,有部分页面元素是只显示了部分摘要信息的,需要把鼠标移上去后才能显示全部信息(类似title的弹出显示).这就需要在chrome插 ...
随机推荐
- HTML5零散知识点总结
1.产生ioc图标的网站: http://www.bitbug.net/ 链接ioc图标: <link rel="shortcut icon" type="imag ...
- css清除间隙
.clear{clear:both;height:0;width:0;line-height:0;overflow:hidden;}
- Office365学习笔记—创建WikiPage
1,项目有个需求:项目表每更新一次,就把跟该项目有关的任务创建一个静态页(历史版本功能)! 注意事项:需要在页面上拖一个ContentEditer!将代码放在ContentEditer里面,因为我试过 ...
- C++练习 | 创建并正序输出不带头结点的链表
#include <iostream> #include <cstdio> #include <stdlib.h> using namespace std; str ...
- My collage goals
PART ONE: THE GOALS OF GRADE ONE 1, Try my best to improve my GPA , keep it around 4.0 2, Learn mor ...
- MySQL学习之流程结构
流程结构 流程结构:代码的执行顺序. if分支 根据要求选择合适的执行部分. 基本语法 if在MySQL中有两种基本用法 1.用在select查询当中,当作一种条件来进行判断. 基本语法:if(条件, ...
- 常用模块 - shutil模块
一.简介 shutil – Utility functions for copying and archiving files and directory trees.(用于复制和存档文件和目录树的实 ...
- Linux通过Shell脚本命令修改密码不需要交互
交互方式修改密码 1. ssh 远程到主机: 2. 切换到root账号: [一般都是切换到root进行密码修改,如果普通用户修改自己的密码,要输入原密码,然后新密码要满足复杂度才OK]: 3. pas ...
- js如何生成id随机数
有时候在我们在新增数据时,需要自动生成主键id等,就经常会遇到需要生成随机数的方法. 下面先介绍一种比较简单的生成随机数方法: //产生随机数函数 function RndNum(n){ var rn ...
- 使用jQuery实现向上循环滚动效果(超简单)
今天突发奇想 想到的一个新思路 通过使用animate改变外边距达到滚动效果 再用复制节点插入到最后一行达到循环目的 HTML代码如下 <body> <ul style=" ...