一个超简单的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困惑—包装集 DOM节点
Oct 16 Javascript
js弹出框轻量级插件jquery.boxy使用介绍
Jan 15 Javascript
目前流行的JavaScript库的介绍及对比
Sep 29 Javascript
php显示当前文件所在的文件以及文件夹所有文件以树形展开
Dec 13 Javascript
Jquery时间轴特效(三种不同类型)
Nov 02 Javascript
原生js实现autocomplete插件
Apr 14 Javascript
JavaScript和jquery获取父级元素、子级元素、兄弟元素的方法
Jun 05 Javascript
js学习阶段总结(必看篇)
Jun 16 Javascript
用js读写cookie的简单方法(推荐)
Aug 08 Javascript
Vue.js实现模拟微信朋友圈开发demo
Apr 20 Javascript
小程序实现图片移动缩放效果
May 26 Javascript
vue 判断两个时间插件结束时间必选大于开始时间的代码
Nov 04 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代码
2011/11/27 PHP
如何阻止网站被恶意反向代理访问(防网站镜像)
2014/03/18 PHP
php中try catch捕获异常实例详解
2014/11/21 PHP
thinkphp5.1 文件引入路径问题及注意事项
2018/06/13 PHP
javascript的事件描述
2006/09/08 Javascript
完美解决JS中汉字显示乱码问题(已解决)
2006/12/27 Javascript
Javascript 自适应高度的Tab选项卡
2011/04/05 Javascript
jQuery点击后一组图片左右滑动的实现代码
2012/08/16 Javascript
JS操作CSS随机改变网页背景实现思路
2014/03/10 Javascript
javascipt:filter过滤介绍及使用
2014/09/10 Javascript
浅析jQuery 遍历函数,javascript中的each遍历
2016/05/25 Javascript
使用递归遍历对象获得value值的实现方法
2016/06/14 Javascript
js 打开新页面在屏幕中间的实现方法
2016/11/02 Javascript
nodejs使用express获取get和post传值及session验证的方法
2017/11/09 NodeJs
vuex 的简单使用
2018/03/22 Javascript
解决axios发送post请求返回400状态码的问题
2018/08/11 Javascript
AngularJS使用$http配置对象方式与服务端交互方法
2018/08/13 Javascript
解决Layui数据表格中checkbox位置不居中的方法
2018/08/15 Javascript
Vue路由对象属性 .meta $route.matched详解
2019/11/04 Javascript
JS实现随机抽取三人
2019/11/06 Javascript
JS中类的静态方法,静态变量,实例方法,实例变量区别与用法实例分析
2020/03/14 Javascript
vue select 获取value和lable操作
2020/08/28 Javascript
Python Web框架Flask中使用百度云存储BCS实例
2015/02/08 Python
Python实现k-means算法
2018/02/23 Python
详解Python下载图片并保存本地的两种方式
2019/05/15 Python
python爬虫实现POST request payload形式的请求
2020/04/30 Python
Python中使用filter过滤列表的一个小技巧分享
2020/05/02 Python
Python如何爬取b站热门视频并导入Excel
2020/08/10 Python
MAC Cosmetics官方网站:魅可专业艺术彩妆
2019/04/10 全球购物
Linux管理员面试经常问道的相关命令
2014/12/12 面试题
客服文员岗位职责
2013/11/29 职场文书
幼儿教育感言
2014/02/05 职场文书
酒店端午节活动方案
2014/08/26 职场文书
催款函范文
2015/06/24 职场文书
新郎父亲婚礼致辞
2015/07/27 职场文书
Windows Server 2019 安装DHCP服务及相关配置
2022/04/28 Servers