废话不多说,先贴代码,再解释

    <script>
$(document).ready(function(){
$("button").click(function(){
$("#div1").fadeToggle();
$("#div2").fadeToggle("slow");
$("#div3").fadeToggle();
});
});
</script> <p>演示带有不同参数的 fadeToggle() 方法。</p>
<button>点击这里,使三个矩形淡入淡出</button>
<br><br>
<div id="div1" style="width:80px;height:80px;background-color:red;"></div>
<br>
<div id="div2" style="width:80px;height:80px;background-color:green;"></div>
<br>
<div id="div3" style="width:80px;height:80px;background-color:blue;"></div>

要点(Tips):

1、$("button").click({

    });

这是在选取点击事件对应按钮的关键,不能出现错误。

2、$("#div1").fadeToggle();

这是选取节点,并且调用函数的过程

另外就是你的 html 代码,注意 节点 ID 或者 Class 的设定

今天依然是 JQ点击事件之“点击淡入淡出事件”的更多相关文章

  1. 通过js或jq增加的代码,点击事件或其他一些事件不起作用时

    通过js或jq增加的代码,点击事件或其他一些事件不起作用时,可使用 $(document).on("click",".noshow",function() { ...

  2. 21.JQ的监听事件(点击div外面可以让它消失)

    JQ的监听事件(点击div外面可以让它消失) //监听整个页面 $(document).bind("click", function() { //给需要的对象赋予事件 $(&quo ...

  3. js+jq 淡入淡出轮播(点击+定时+鼠标进入移出事件)

    <!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title> ...

  4. jQuery之防止冒泡事件,冒泡事件就是点击子节点,会向上触发父节点,祖先节点的点击事件。

    冒泡事件就是点击子节点,会向上触发父节点,祖先节点的点击事件. 下面是html代码部分: <body> <div id="content"> 外层div元素 ...

  5. JS怎样将拖拉事件与点击事件分离?

    帖子:http://bbs.csdn.net/topics/390785395?page=1#post-397369340 怎样将拖拉事件跟点击事件分离? 须要做到:拖拉时不触动点击事件 <ht ...

  6. JavaScript的for循环中嵌套一个点击事件为何点击一次弹出多个相同的值

    先看下面一段代码: for(var i=0; i<10; i++) { $('#ul').bind('click', function() { alert(i) }) } 对于这段代码,当点击I ...

  7. js、jq事件绑定方式总结——以click事件为例

    一.JavaScript点击事件绑定方法 1.1 HTML onclick事件属性 <button onclick="clickMe(this)">click me&l ...

  8. 消除点击连接或者按钮或者执行onclick事件时出现的边框

    css中添加 *:not(input) { font-family: sans-serif; font-size-adjust: none; -webkit-user-select: none; -w ...

  9. (网页)HTML5 Canvas ( 事件交互, 点击事件为例 ) isPointInPath(转)

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

随机推荐

  1. Subversion详解

    Subversion特性 1.版本化目录 可以跟踪目录树的变更.文件和目录都是版本化的,SVS只能跟踪单个文件: 2.精确的文件跟踪 可以对文件和目录进行 增加.复制.改名,解决了同名 而 无关的文件 ...

  2. CA 证书

    1.ubuntu curl 命令报错(CA) kamil@vm-ubuntu:~$ curl https://szxyzs.vanke.com/DataCenter/datacenter/api cu ...

  3. Java多线程与并发库高级应用-java5线程并发库

    java5 中的线程并发库 主要在java.util.concurrent包中 还有 java.util.concurrent.atomic子包和java.util.concurrent.lock子包 ...

  4. 【poj3263】 Tallest Cow

    http://poj.org/problem?id=3263 (题目链接) 题意 n头奶牛排成一排,最高的一头I身高H,给出R个条件(a,b),表示a,b之间的奶牛都要比a矮,b的身高大于等于a.求每 ...

  5. POJ2456 Aggressive cows

    Aggressive cows 二分,关键是转化为二分! #include <cstdio> #include <algorithm> ; ; int N, C; int a[ ...

  6. [SVN Mac自带SVN结合新浪SAE进行代码管理]

    前一篇我转载了别人SVN的使用方法,前面的配置和服务器我不是很明白,自己尝试后发现我需要使用到的核心命令是下面一些. 新浪SAE提供了SVN代码管理仓库,只要进入相应应用,然后点击左侧代码管理,到最下 ...

  7. [Android]Volley源码分析(一)

    一. 如何使用Volley? 1. 首先定义一个RequestManager类,用来在Android程序启动时对Volley进行初始化.RequestManager为单例类,因为只有在程序启动时调用, ...

  8. 9 HTML&JS等前端知识系列之Ajax post请求带有token向Django请求

    我们 在母板上写入这段代码: <script type="text/javascript"> // 个人定义大函数,不是重点,可以忽略 $(document).read ...

  9. 我所了解的cgi

    http://www.cnblogs.com/liuzhang/p/3929198.html 当我们在谈到cgi的时候,我们在讨论什么 最早的Web服务器简单地响应浏览器发来的HTTP请求,并将存储在 ...

  10. JQuery------.load()从服务器获取数据并加载到某个类的方法

    注意:需要在../Content/asf.txt路径下加入文件 html <button class="Btn">按钮</button> js 参数意义: ...