一个超简单的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 相关文章推荐
Javascript的匿名函数小结
Dec 31 Javascript
js处理自己不能定义二维数组的方法详解
Mar 03 Javascript
jQuery+PHP打造滑动开关效果
Dec 16 Javascript
深入探寻javascript定时器
Jan 02 Javascript
Js控制滑轮左右滑动实例
Feb 13 Javascript
一个字符串中出现次数最多的字符 统计这个次数【实现代码】
Apr 29 Javascript
ashx文件获取$.ajax()方法发送的数据
May 26 Javascript
深入理解JavaScript中Ajax
Aug 02 Javascript
JavaScript判断数组是否存在key的简单实例
Aug 03 Javascript
Javascript点击按钮随机改变数字与其颜色
Sep 01 Javascript
基于JS实现快速读取TXT文件
Aug 25 Javascript
vue iview 隐藏Table组件里的某一列操作
Nov 13 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生成带有雪花背景的验证码
2008/09/28 PHP
PHP下通过file_get_contents的代理使用方法
2011/02/16 PHP
php实现爬取和分析知乎用户数据
2016/01/26 PHP
Yii2使用$this-&gt;context获取当前的Module、Controller(控制器)、Action等
2017/03/29 PHP
Laravel框架路由设置与使用示例
2018/06/12 PHP
php基于Redis消息队列实现的消息推送的方法
2018/11/28 PHP
PHP切割汉字的常用方法实例总结
2019/04/27 PHP
javascript中substr,substring,slice.splice的区别说明
2010/11/25 Javascript
jQuery下通过$.browser来判断浏览器.
2011/04/05 Javascript
js登录弹出层特效
2014/03/07 Javascript
js中的for如何实现foreach中的遍历
2014/05/31 Javascript
js监听鼠标点击和键盘点击事件并自动跳转页面
2014/09/24 Javascript
javascript中错误使用var造成undefined
2016/03/31 Javascript
详解JavaScript节流函数中的Throttle
2016/07/16 Javascript
javascript获取网页各种高宽及位置的方法总结
2016/07/27 Javascript
jQuery Ajax自定义分页组件(jquery.loehpagerv1.0)实例详解
2017/05/01 jQuery
vue.js 2.0实现简单分页效果
2019/07/29 Javascript
js动态获取时间的方法分析
2019/08/02 Javascript
layui form表单提交后实现自动刷新
2019/10/25 Javascript
vue 路由缓存 路由嵌套 路由守卫 监听物理返回操作
2020/08/06 Javascript
JS中队列和双端队列实现及应用详解
2020/09/29 Javascript
[08:53]DOTA2每周TOP10 精彩击杀集锦vol.9
2014/06/26 DOTA
使用Python简单的实现树莓派的WEB控制
2016/02/18 Python
Python编程之黑板上排列组合,你舍得解开吗
2017/10/30 Python
Python实现的个人所得税计算器示例
2018/06/01 Python
基于python的ini配置文件操作工具类
2019/04/24 Python
python 解决flask uwsgi 获取不到全局变量的问题
2019/12/22 Python
Python自动登录QQ的实现示例
2020/08/28 Python
供货协议书范本
2014/04/22 职场文书
2014年母亲节寄语
2014/05/07 职场文书
珍惜资源保护环境的建议书
2014/05/14 职场文书
体育教师求职信
2014/06/30 职场文书
2015小学音乐教师个人工作总结
2015/07/21 职场文书
八年级历史教学反思
2016/02/19 职场文书
Redis中key的过期删除策略和内存淘汰机制
2022/04/12 Redis
java开发双人五子棋游戏
2022/05/06 Java/Android