一个超简单的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 相关文章推荐
Ajax,UTF-8还是GB2312 eval 还是execScript
Nov 13 Javascript
一个可以兼容IE FF的加为首页与加入收藏实现代码
Nov 02 Javascript
JavaScript QueryString解析类代码
Jan 17 Javascript
JavaScript学习笔记之Function对象
Jan 22 Javascript
JavaScript闭包详解
Feb 02 Javascript
js实现双击图片放大单击缩小的方法
Feb 17 Javascript
JavaScript使用ActiveXObject访问Access和SQL Server数据库
Apr 02 Javascript
js库Modernizr的介绍和使用
May 07 Javascript
Javascript模仿淘宝信用评价实例(附源码)
Nov 26 Javascript
JS 组件系列之Bootstrap Table 冻结列功能IE浏览器兼容性问题解决方案
Jun 30 Javascript
JS实现点击复选框变更DIV显示状态的示例代码
Dec 18 Javascript
如何基于原生javaScript生成带图片的二维码
Nov 21 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中的字符串函数
2006/10/09 PHP
Excel数据导入Mysql数据库的实现代码
2008/06/05 PHP
PHP 使用redis简单示例分享
2015/03/05 PHP
Laravel 5.3 学习笔记之 安装
2016/08/28 PHP
php swoole多进程/多线程用法示例【基于php7nts版】
2019/08/12 PHP
tagName的使用,留一笔
2006/06/26 Javascript
Jquery 插件学习实例1 插件制作说明与tableUI优化
2010/04/02 Javascript
精选的10款用于构建良好易用性网站的jQuery插件
2011/01/23 Javascript
JavaScript实现的字符串replaceAll函数代码分享
2015/04/02 Javascript
JQuery日历插件My97DatePicker日期范围限制
2016/01/20 Javascript
javascript实现下雪效果【实例代码】
2016/05/03 Javascript
jQuery插件FusionCharts实现的2D面积图效果示例【附demo源码下载】
2017/03/06 Javascript
Vue精简版风格指南(推荐)
2018/01/30 Javascript
原生JS实现获取及修改CSS样式的方法
2018/09/04 Javascript
在小程序/mpvue中使用flyio发起网络请求的方法
2018/09/13 Javascript
浅谈vux之x-input使用以及源码解读
2018/11/04 Javascript
NestJs 静态目录配置详解
2019/03/12 Javascript
使用Three.js实现太阳系八大行星的自转公转示例代码
2019/04/09 Javascript
Node.js如何优雅的封装一个实用函数的npm包的方法
2019/04/29 Javascript
详细教你微信公众号正文页SVG交互开发技巧
2019/07/25 Javascript
浅析vue中的provide / inject 有什么用处
2019/11/10 Javascript
微信小程序事件流原理解析
2019/11/27 Javascript
vue实现前端分页完整代码
2020/06/17 Javascript
微信小程序onShareTimeline()实现分享朋友圈
2021/01/07 Javascript
[01:45]IMBATV TI4前线报道-选手到达
2014/07/07 DOTA
[55:42]VG vs VGJ.T 2018国际邀请赛淘汰赛BO1 8.21
2018/08/22 DOTA
python实现音乐下载器
2018/04/15 Python
python实现坦克大战
2020/04/24 Python
Python descriptor(描述符)的实现
2020/11/15 Python
Urban Outfitters英国官网:美国平价服饰品牌
2016/11/25 全球购物
路政管理毕业自荐书范文
2014/02/10 职场文书
学生抄作业检讨书(2篇)
2014/10/17 职场文书
2014年污水处理厂工作总结
2014/12/19 职场文书
公司晚宴祝酒词
2015/08/11 职场文书
pytorch 中nn.Dropout的使用说明
2021/05/20 Python
vscode内网访问服务器的方法
2022/06/28 Servers