`
Josh_Persistence
  • 浏览: 1646318 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类

Jquery简单入门到精通细节 - (十)Jquery效果之“Callback 函数”

阅读更多

jQuery Callback 函数

jQuery 动画的问题

许多 jQuery 函数涉及动画。这些函数也许会将 speedduration 作为可选参数。

例子:$("p").hide("slow")

speedduration 参数可以设置许多不同的值,比如 "slow", "fast", "normal" 或毫秒。

实例

$("button").click(function(){
$("p").hide(1000);
});

亲自试一试

由于 JavaScript 语句(指令)是逐一执行的 - 按照次序,动画之后的语句可能会产生错误或页面冲突,因为动画还没有完成。

为了避免这个情况,您可以以参数的形式添加 Callback 函数。

jQuery Callback 函数

当动画 100% 完成后,即调用 Callback 函数。

典型的语法:

$(selector).hide(speed,callback)

callback 参数是一个在 hide 操作完成后被执行的函数。

错误(没有 callback)

$("p").hide(1000);
alert("The paragraph is now hidden");

亲自试一试

正确(有 callback)

$("p").hide(1000,function(){
alert("The paragraph is now hidden");
});

亲自试一试

分享到:
评论

相关推荐

    在javascript文件中读取properties文件需要的插件jquery.i18n.properties-min-1.0.9.js

    其中一个常用的插件是`jquery.i18n.properties`,正如标题所提及的`jquery.i18n.properties-min-1.0.9.js`,这是一个轻量级的jQuery插件,专门用于在JavaScript中处理.properties文件。 `jquery.i18n.properties`...

    jQuery摄像头插件jquery-webcam-plugin

    总之,`jQuery webcam plugin`为开发者提供了一种简单而灵活的方式来整合摄像头功能,使得Web应用可以更加丰富和互动。尽管HTML5的原生API正在逐步取代Flash,但在兼容性和跨平台需求下,该插件依然具有很高的实用...

    jquery开发入门整理(所需要了解的)

    jQuery提供了大量的内置函数,这些函数封装了许多常见的DOM操作、事件处理以及动画效果,使得开发者无需从零开始编写复杂的JavaScript代码。这极大地提高了开发效率,同时也减少了出错的可能性。 #### 理由三:跨...

    jquery1.4 jquery,jquery-1.4,jquery1.4,最新jquery.js,jquery-1.4.min.js

    3. **动画效果**:此版本增强了动画效果的灵活性,添加了更多自定义选项,如缓动函数(easing)和完成回调(complete callback)。 4. **插件支持**:jQuery 1.4提供了更好的插件开发支持,使得开发者可以更容易地...

    [jQuery入门到精通]第7章:jQuery动画-让页面动起来!3.pdf

    本章将深入讲解jQuery中的动画相关函数,帮助你从入门到精通,让你的网页动起来。 ### 1. jQuery 动画基础 jQuery 提供了一系列的动画方法,如 `fadeIn()`, `fadeOut()`, `slideToggle()`, `animate()` 等,它们...

    jquery入门

    jQuery 提供了一系列的事件函数,使得事件处理变得简单。例如: - `click(function)`: 当元素被点击时执行指定的函数。 - `hover(functionIn, functionOut)`: 当鼠标进入元素时执行`functionIn`,离开时执行`...

    jQuery-2.2.4.js

    动画效果是jQuery的亮点,$.fn.animate()方法允许开发者创建自定义动画,而$.fn.slideToggle()、$.fn.fadeIn()、$.fn.fadeOut()等预定义的动画函数则提供了常见的过渡效果。 最后,jQuery-2.2.4.js版本中还包含了...

    jquery.i18n.properties-min-1.0.9

    其中,`name`参数是资源文件名前缀,`path`是文件路径,`mode`指定返回结果的类型,`callback`则是在加载完成后执行的回调函数。 6. **动态切换语言** 插件还支持在用户操作后动态切换语言。只需重新调用`.i18n....

    jquery-3.3.1.js和 jquery-3.3.1.min.js

    3. **动画效果**:jQuery的`.animate()`方法允许开发者创建复杂的动画效果,如淡入淡出、滑动等。此外,还有预定义的`.fadeIn()`, `.slideUp()`等便捷函数。 4. **Ajax交互**:jQuery的`.ajax()`方法是进行异步数据...

    jQuery中文入门指南

    **jQuery中文入门指南** jQuery是一款广泛应用于Web开发的JavaScript库,它简化了JavaScript的DOM操作、事件处理、动画设计和Ajax交互。这个指南将帮助初学者快速掌握jQuery的基础知识和核心概念。 ### 1. jQuery...

    jqueryAPI函数chm文档

    总结,jQuery API函数chm文档详尽地涵盖了jQuery的各种功能,从选择器到DOM操作,再到动画和Ajax,每一个函数都是开发者的得力助手。熟练掌握这些API,将极大地提升Web开发效率,使得前端代码更加简洁高效。无论你是...

    jquery-endless-scroll-master 滚动加载插件

    总之,`jquery-endless-scroll-master` 插件为开发者提供了一个便捷的方式来实现网页的滚动加载功能,通过简单的配置和集成,即可为你的项目增添这一现代化的交互体验。合理使用并结合后端接口优化,能有效提升用户...

    jquery函数大全

    《jQuery函数大全详解》 jQuery库是JavaScript中最广泛使用的库之一,它简化了HTML文档遍历、事件处理、动画和Ajax交互。以下是一份详尽的jQuery函数大全,涵盖了基础函数实现及其用法。 1. **Attribute操作**: ...

    jquery入门培训及案例

    **jQuery入门培训及案例** jQuery是一款广泛应用于前端开发的JavaScript库,它简化了HTML文档遍历、事件处理、动画制作和Ajax交互等任务。通过学习jQuery,开发者可以更高效地编写代码,提升网页的交互性和用户体验...

    JQuery--toggle 函数.rar

    在JQuery中,`toggle()`函数是一个非常实用的功能,用于切换元素的可见状态,使得开发者能够轻松地实现元素的显示和隐藏效果。本教程将深入探讨`toggle()`函数的使用方法以及相关知识点。 首先,`toggle()`函数的...

    jquery入门和应用

    **jQuery入门与应用详解** jQuery,作为一款广泛应用于前端开发的JavaScript库,以其简洁的API和强大的功能,深受开发者喜爱。本教程将深入浅出地介绍jQuery的基本概念、核心功能及实际应用,帮助初学者快速上手并...

    前端项目-jquery-impromptu.zip

    - 插件通常通过$.fn.extend()方法添加到jQuery对象上,使得可以通过链式调用来使用。 3. **jQuery-Impromptu特性**: - 自定义样式:jQuery-Impromptu提供了丰富的CSS样式,可以轻松调整对话框的外观,适应不同的...

    jQuery详细入门教程

    《jQuery详细入门教程》 jQuery 是一款广泛应用于前端开发的JavaScript库,它的出现极大地简化了JavaScript的使用,尤其是在处理DOM操作、事件绑定、动画效果和Ajax交互等方面。jQuery以其强大的功能和良好的浏览器...

    jquery下jstree简单应用 - v1.0.docx

    由于文档提供的代码片段不完整,无法展示完整的 `function_callBack` 函数实现细节。但从以上代码可以看出,该函数主要用于处理数据源,为每个节点设置相应的状态以及其他属性。 #### 四、总结 本文档通过具体的...

    jquery入门培训jquery入门培训

    5. **Ajax交互**:jQuery的`$.ajax()`函数封装了XMLHttpRequest对象,使得异步数据请求变得简单,同时支持JSONP、jsonpCallback等跨域请求方式。 6. **链式操作**:jQuery方法返回的是jQuery对象,所以可以连续调用...

Global site tag (gtag.js) - Google Analytics