一个超简单的jQuery回调函数例子(分享)


Posted in Javascript onAugust 08, 2016

jQuery回调函数简单使用

比如说,我们想要点击某个按钮后触发事件,

先把一些指定内容给隐藏掉,

然后跳出相关信息的对话框。

如果使用普通的方法,

不用回调函数的话,

会有怎么样的效果呢?

效果是先弹出对话框再隐藏内容,

然后再隐藏指定内容。

这显然不是我们想要的效果,

如果使用回调函数,就可以解决这个问题。

当然,回调函数功能远不只这么简单……

具体的代码如下:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> 
<% 
  String path = request.getContextPath(); 
  String basePath = request.getScheme() + "://" 
      + request.getServerName() + ":" + request.getServerPort() 
      + path + "/"; 
%> 
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
  <head> 
    <base href="<%=basePath%>"> 
 
    <title>My JSP 'MyJsp.jsp' starting page</title> 
    <title>test</title> 
    <script type="text/javascript" src="js/jQuery/jquery-1.4.4.min.js"></script> 
    <script type="text/javascript"> 
      $(document).ready(function(){ 
        $("#button1").click(function(){ 
          $("p").hide("slow"); 
           alert("不使用回调,先弹出对话框再隐藏!"); 
        }) 
        $("#button2").click(function(){ 
          $("p").hide("slow",function(){ 
            alert("使用回调函数,先隐藏再弹出对话框!"); 
          });     
        }) 
      }) 
    </script> 
  </head> 
  <body> 
    <p> 
      I love you,java. 
      <br> 
      I love you,java. 
      <br> 
      I love you,java. 
      <br> 
      I love you,java. 
      <br> 
      I love you,java. 
      <br> 
      I love you,java. 
      <br> 
      I love you,java. 
      <br> 
      I love you,java. 
      <br> 
      I love you,java. 
      <br> 
      I love you,java. 
      <br> 
      I love you,java. 
      <br> 
      I love you,java. 
      <br> 
      I love you,java. 
    </p> 
    <input id="button1" type="button" value="没使用回调函数!" /> 
    <input id="button2" type="button" value="使用回调函数!" /> 
  </body> 
</html>

以上这篇一个超简单的jQuery回调函数例子(分享) 就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Jquery 学习笔记(一)
Oct 13 Javascript
通过隐藏iframe实现文件下载的js方法介绍
Feb 26 Javascript
jQuery中对未来的元素绑定事件用bind、live or on
Apr 17 Javascript
Javascript实现计算个人所得税
May 10 Javascript
JavaScript实现的浮动层框架用法实例分析
Oct 10 Javascript
JavaScript实现iframe自动高度调整和不同主域名跨域
Feb 27 Javascript
js中字符串编码函数escape()、encodeURI()、encodeURIComponent()区别详解
Apr 01 Javascript
jquery分页插件jquery.pagination.js使用方法解析
Apr 01 Javascript
Javascript 事件冒泡机制详细介绍
Oct 10 Javascript
JavaScript创建对象的常用方式总结
Aug 10 Javascript
js图片无缝滚动插件使用详解
May 26 Javascript
解决在Vue中使用axios POST请求变成OPTIONS的问题
Aug 14 Javascript
Bootstrap Table服务器分页与在线编辑应用总结
Aug 08 #Javascript
使用jQuery5分钟快速搞定双色表格的简单实例
Aug 08 #Javascript
BootStrap Table 分页后重新搜索问题的解决办法
Aug 08 #Javascript
用js读写cookie的简单方法(推荐)
Aug 08 #Javascript
Js遍历键值对形式对象或Map形式的方法
Aug 08 #Javascript
js中遍历Map对象的简单实例
Aug 08 #Javascript
14 个折磨人的 JavaScript 面试题
Aug 08 #Javascript
You might like
如何使用php实现评委评分器
2015/07/31 PHP
PHP结合Jquery和ajax实现瀑布流特效
2016/01/07 PHP
windows下的WAMP环境搭建图文教程(推荐)
2017/07/27 PHP
PHP实现将几张照片拼接到一起的合成图片功能【便于整体打印输出】
2017/11/14 PHP
PHP如何实现订单的延时处理详解
2017/12/30 PHP
php项目中类的自动加载实例讲解
2019/09/12 PHP
PHPstorm激活码2020年5月13日亲测有效
2020/09/17 PHP
Javascript读取cookie函数代码
2010/10/16 Javascript
Google AJAX 搜索 API实现代码
2010/11/17 Javascript
javascript笔记 String类replace函数的一些事
2011/09/22 Javascript
Nodejs关于gzip/deflate压缩详解
2015/03/04 NodeJs
$.extend 的一个小问题
2015/06/18 Javascript
jQuery+Ajax实现限制查询间隔的方法
2016/06/07 Javascript
javascript cookie基础应用之记录用户名的方法
2016/09/20 Javascript
基于node.js依赖express解析post请求四种数据格式
2017/02/13 Javascript
Vue.js实现一个漂亮、灵活、可复用的提示组件示例
2017/03/17 Javascript
vue仿淘宝订单状态的tab切换效果
2020/06/23 Javascript
Vue 组件(component)教程之实现精美的日历方法示例
2018/01/08 Javascript
Layui 数据表格批量删除和多条件搜索的实例
2019/09/04 Javascript
vue element 中的table动态渲染实现(动态表头)
2019/11/21 Javascript
[02:41]辉夜杯现场一家三口 “我爸玩风行 我玩血魔”
2015/12/27 DOTA
python中copy()与deepcopy()的区别小结
2018/08/03 Python
python实现创建新列表和新字典,并使元素及键值对全部变成小写
2019/01/15 Python
python中的decimal类型转换实例详解
2019/06/26 Python
python 等差数列末项计算方式
2020/05/03 Python
Python参数传递实现过程及原理详解
2020/05/14 Python
python 带时区的日期格式化操作
2020/10/23 Python
用pushplus+python监控亚马逊到货动态推送微信
2021/01/29 Python
HTML5拖放效果的实现代码
2016/11/17 HTML / CSS
HTML5+WebSocket实现多文件同时上传的实例
2016/12/29 HTML / CSS
物流管理毕业生自荐信
2013/10/24 职场文书
《绿色蝈蝈》教学反思
2014/03/02 职场文书
违反交通法规检讨书
2014/09/10 职场文书
详解TS数字分隔符和更严格的类属性检查
2021/05/06 Javascript
如何解决springcloud feign 首次调用100%失败的问题
2021/06/23 Java/Android
python 中的jieba分词库
2021/11/23 Python