jQuery中的hover()方法用于模拟光标悬停事件。当光标移动到元素上时,会触发指定的第一个函数(enter),当光标移出这个元素时,会触发指定的第二个函数(leave)。如下面一段代码:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8" /><title>jQuery中的hover()方法</title><script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"></script>
</head>
<body><script>$(function(){$('#panel').hover(function(){$(this).next.show();},function(){$(this).next.hide();});});</script>
</body>
</html>

代码运行后的效果和下面代码运行后的效果是一样的。

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8" /><title>jQuery中的hover()方法</title><script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"></script>
</head>
<body><script>$(function(){$('#panel').mouseover(function(){$(this).next.show();}).mouseout(function(){$(this).next.hide();});});</script>
</body>
</html>

注意:(1)CSS中有伪类选择符,例如‘:hover’,当用户光标悬停在元素上时,会改变元素的外观。在大多数符合规范的浏览器中,伪类选择符可以用于任何元素。然而在IE6浏览器中,类选择符仅可用于超链接元素。对于其他元素,可以使用jQuery的hover()方法。

(2) hover()方法准确的来说是替代了jQuery中的bind('mouseenter')和bind('mouseleave'),而不是替代bind('mouseover')和bind('mouseout')。因此当需要触发hover()方法的第二个函数时,需要用trigger('mouseleave')来触发,而不是trigger('mouseout')。

jQuery中的hover()方法相关推荐

  1. 用JQuery中的Ajax方法获取web service等后台程序中的方法

    用JQuery中的Ajax方法获取web service等后台程序中的方法 1.准备需要被前台html页面调用的web Service,这里我们就用ws来代替了,代码如下: using System; ...

  2. jQuery中animate( )的方法及$(“body“).animate({‘scrollTop‘:top},500)不被Firefox支持问题的解决

    jQuery中animate( )的方法及$("body").animate({'scrollTop':top},500)不被Firefox支持问题的解决 参考文章: (1)jQu ...

  3. jquery中的map()方法与js中的map()方法

    1.jquery中的map()方法 首先看一个简单的实例: $("p").append( $("input").map(function(){ return $ ...

  4. jQuery 中的 end 方法

    如有错误,欢迎批评指正! jQuery 中的 end 方法,我从 stackoverflow 上的一个回答开始讲: 原文链接: What does the .end() function do in ...

  5. 原生JS中的三大家族(offset/scroll/client)与jQuery中对应的方法

    JS中的offset家族: 一.offsetEWidth与offsetHeight: 获取的是元素的实际宽高 = width + border + padding 注意点: 1.可以获取行内及内嵌的宽 ...

  6. ajax远程调用,jquery中的ajax方法怎样通过JSONP进行远程调用

    关于JSONP的概念和为什么要使用JSONP网上已经有很多教程,这一节主要演示下在JQUERY中的ajax方法怎样通过JSONP进行远程调用 首先介绍下$.ajax的参数 type:请求方式 GET/ ...

  7. JQuery中ajax,get方法在asmx中的使用

    喜大普奔,今天终于完成了一个月前就想完成的一个代码实现.就是在点击一个按钮后禁用按钮,弹出正在操作的提示框,执行完事件后再启用按钮. 以前的想法是Ajax和aspx联用,这样,省页面,也不用对后台代码 ...

  8. js中的onclick事件和JQuery中的click方法以及on方法事件用法总结

    1.onclick是绑定的事件(它是一个事件),注意该事件绑定只是JacaScript中有(js中的),Jquery中并没有此事件,告诉浏览器在鼠标点击时候要做什么 2.click方法(jquery中 ...

  9. 关于JQuery中的appendTo方法

    JQuery中的appendTo方法是会改变页面原有的结构,包括原从页面中取到结构的地方,比如如下代码(代码来自慕课网): <!DOCTYPE html> <html> < ...

最新文章

  1. java调用可执行文件
  2. layui table is not a valid module
  3. python画-用Python画一颗特别的心送给她
  4. 【Android 安装包优化】资源打包配置 ( resources.arsc 资源映射表 | 配置国际化资源 )
  5. php的socket通信
  6. VMware虚拟机扩展Ubuntu系统磁盘空间
  7. java有什么压力_编程语言的心智负担!你学编程得有多大的压力快来测试一下...
  8. Microsoft C 运行时库 (CRT) 参考
  9. 安卓学习随笔 -- 自定义标题栏
  10. 今日恐慌与贪婪指数为68 贪婪程度有所上升
  11. 证明的思路 —— 数形结合
  12. python中的换行符是哪个键_Python换行符问题:\r\n还是\n?
  13. 感恩节福利:掘金携手异步社区 掘金小册新品发布2017异步社区优秀图书和作译者评选启动...
  14. Axure RP8.0仿制知乎页面(更新3)
  15. Java验收项目清单_软件验收管理工作内容
  16. 性能服务器漫画免费下拉式,热浪漫画_斗破苍穹漫画免费下拉式
  17. 年终盘点 | 2020年,国内私有云正式进入3.0时代
  18. 20200726 T3 树高【ETT(dfs序splay)维护同色边连通块】
  19. matsuri.icu 筛选单场直播中 指定用户的弹幕
  20. 格兰杰因果检验准备-平稳性检验-Eviews

热门文章

  1. c语言编写程序计算行列式值,求行列式的值,用C语言怎么写啊? 如何求行列式的值...
  2. 吞噬星空是鸿蒙三部曲吗,我吃西红柿最新作品竟然是它?看来鸿蒙金榜第四名已有归属...
  3. CSS的tree shaking
  4. mysql orm .net_.NET(C#)有哪些主流的ORM框架,SqlSugar,Dapper,EF还是...
  5. 实用性文章:精密电阻的特性与应用
  6. 提升固定资产管理效率,一招轻松制胜
  7. 5G商用后的资费会贵吗?
  8. Internet Explorer 编程简述(四)“添加到收藏夹”对话框
  9. OpenAI提交GPT-5商标申请;韩国室温超导团队称论文存在缺陷,已要求下架;Nim v2.0释出 | 极客头条
  10. phpMyAdmin配置管理多个数据库服务器方法