`
nianshi
  • 浏览: 419672 次
  • 性别: Icon_minigender_1
  • 来自: 济南
社区版块
存档分类
最新评论

Jquery中的hover()和toggle()用法

 
阅读更多

hover(fn1,fn2): 一个模仿悬停事件(鼠标移动到一个对象上面及移出这个对象)的方法。当鼠标移动到一个匹配的元素上面时,会触发指定的第一个函数。当鼠标移出这个元素时,会触发指定的第二个函数。
//当鼠标放在表格的某行上时将class置为over,离开时置为out。
$("tr").hover(function(){
$(this).addClass("over");
},
        function(){
        $(this).addClass("out");
});

 

 

toggle(evenFn,oddFn): 每次点击时切换要调用的函数。如果点击了一个匹配的元素,则触发指定的第一个函数,当再次点击同一元素时,则触发指定的第二个函数。随后的每次点击都重复对这两个函数的轮番调用。
        //每次点击时轮换添加和删除名为selected的class。
        $("p").toggle(function(){
                $(this).addClass("selected");   
        },function(){
                $(this).removeClass("selected");
        });

 

 

两个函数都能实现轮番调用两个函数。。。。

分享到:
评论

相关推荐

    jQuery中hover方法和toggle方法使用指南

    本文主要讲述jQuery库中的hover方法和toggle方法,这两个方法在处理事件和动画交互方面非常实用。 hover方法是jQuery中的一个自定义事件方法,用来模拟鼠标悬停在元素上的效果。它可以接受两个参数,分别是鼠标悬停...

    jQuery复合事件结合toggle()方法的用法示例

    本文实例讲述了jQuery复合事件结合toggle()方法的用法。分享给大家供大家参考,具体如下: 定义和用法 toggle() 方法用于绑定两个或多个事件处理器函数,以响应被选元素的轮流的 click 事件。 语法: $(selector)....

    jquery hover显示图片详细介绍.rar

    - jQuery的`fadeIn()`和`fadeOut()`方法可用于创建淡入淡出效果,当鼠标悬停和离开时,可以使用这些方法使新图片逐渐出现或消失。 - 同时,`animate()`方法可以自定义更复杂的动画,如改变图片大小、位置等。 7. ...

    jquery导入word.docx

    jquery的使用非常广泛,以下是jquery的一些基本用法: 1. 选择元素:jquery提供了多种方式来选择HTML元素,例如:$('#id')、$('.class')、$('tag')等。 2. 元素操作:jquery提供了多种方式来操作HTML元素,例如:...

    JQuery toggle使用分析

    在hover()方法中,两个参数分别是鼠标悬停时调用的函数和鼠标离开时调用的函数。通过设置这两个函数的切换效果,实现了鼠标悬停时显示div元素,鼠标离开时隐藏div元素的效果。 文章最后提到了一种更复杂的情形,即...

    JQuery入门——事件切换之hover()方法应用介绍

    JQuery中的事件切换主要通过两个方法来实现,分别是hover()和toggle()。其中,hover()方法用于处理鼠标悬停事件,使得鼠标悬停时可以触发一个事件,而鼠标移开时可以触发另一个事件。toggle()方法则用于点击事件的...

    详解jQuery中的事件

    除了上述的`bind()`、`hover()`和`toggle()`,jQuery还有其他事件处理函数,如`unbind()`用于解绑事件,`live()`和`delegate()`用于动态添加的元素的事件处理(现已被`on()`取代),以及`trigger()`用于手动触发事件...

    jQuery 1.4.1 中文参考

    - `hover()`、`toggle()`:鼠标悬停和切换事件。 - 各种事件方法(如`click()`、`change()`、`keydown()`等):绑定特定类型的事件。 **效果** - `show()`、`hide()`、`toggle()`:显示、隐藏和切换元素的可见性。...

    jQuery中toggle()函数的使用实例

    在介绍具体使用实例之前,我们先了解toggle()函数的基本用法。这个函数通常用于绑定两个或多个事件处理函数,当触发该元素的点击事件时,函数会按照顺序依次被调用,从而切换不同的状态或者动作。它的一般形式是: ...

    JQuery中DOM事件合成用法实例分析

    在这篇介绍JQuery DOM事件合成的文章中,主要探讨了两个重要的事件方法:hover()和toggle(),它们是如何实现事件合成的,以及如何在实际开发中应用这些方法来提升用户体验。 首先,hover()方法可以模拟光标悬停事件...

    JQuery权威指南源代码

    使用sortable插件实现列表中表项的拖曳排序操作 使用accordion插件实现区域块的折叠操作 使用datepicker插件实现选择日期的操作一 使用datepicker插件实现选择日期的操作二 使用tabs插件展示选项卡的基本功能 ...

    jQuery权威指南-源代码

    其次详细讲解了jQuery的各种选择器、jQuery操作DOM的方法、jQuery中的事件与应用、jQuery中的动画和特效、Ajax在jQuery中的应用,以及各种常用的jQuery插件的使用方法和技巧,所有这些知识点都配有完整的示例(包括...

    jquery 实例完整例子

    jQuery 是一个广泛使用的JavaScript库,它极大地简化了HTML文档遍历、事件处理、...通过实践这些示例,开发者不仅能掌握jQuery的基本用法,还能进一步提升自己的JavaScript技能,创造出更富表现力和交互性的网页应用。

    练习2:使用jQuery美化英雄联盟简介页.zip

    通过这个练习,你将熟练掌握jQuery的基本用法,包括选择器、事件处理、动画和Ajax,同时也能了解如何将这些技术应用于实际的英雄联盟简介页美化项目中。不断地实践和探索,你将能够创造出更丰富、更具交互性的网页...

    jQuery显示图片详情

    jQuery提供了`.show()`和`.hide()`方法来切换元素的可见性,或者使用`.toggle()`在显示和隐藏之间切换。 4. **CSS操作**:jQuery允许开发者直接操作元素的CSS样式,例如更改元素的透明度、位置等。这对于创建平滑的...

    jQuery展开收缩效果

    本篇文章将深入探讨如何使用jQuery实现展开收缩效果,同时结合`animate`动画和切换图标这两种方法。 首先,我们要了解jQuery的核心概念。jQuery对象是jQuery库中的核心,它封装了DOM元素,提供了一系列方便的方法来...

    jquery教程 15天学会jquery(完整版)

    1. **插件开发**:学习如何编写和使用jQuery插件,扩展jQuery的功能。 2. **遍历与过滤**:掌握`.each()`, `.siblings()`, `.children()`, `.parent()`, `.closest()`等遍历和过滤方法。 3. **DOM遍历与修改**:使用...

    jquery tooltip插件示例

    jQuery Tooltip 插件是网页开发中常用的一种工具,它能够为网页元素...通过学习和实践这个示例,开发者能够更好地理解和掌握如何在网页项目中运用这种功能,提升用户体验,同时也能深入了解 jQuery 插件的使用方法。

    30个jquery经典Demo

    3. **下拉菜单(Dropdown Menu)**:下拉菜单在网页导航中广泛应用,jQuery通过`.toggle()`轻松实现展开与收起,配合`.stop()`防止连续触发导致的闪烁现象。 4. **滑动效果(Slide)**:使用`.slideToggle()`、`....

Global site tag (gtag.js) - Google Analytics