zoukankan      html  css  js  c++  java
  • toggle()方法

    在toggle()方法中,可以依次调用N个指定的函数。直到最后一个函数,然后重复对这些函数轮番调用。
    toggle()方法的功能是每次单机后依次调用函数,请注意到“依次”这两个字,说明该方法在调用函数时并非随机或指定调用,而是用过函数设置的前后顺序进行调用 ,其调用的语法格式如下:


    toggle(fn,fn2,fn3,[fun4,fn5....])  其中参数fn,fn2...,fnN为单机时被依次调用的函数。

     1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
     2 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
     3 <head>
     4 <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
     5 <title>toggle切换事件</title>
     6 <style>
     7     .box{border: solid 1px #666;background-color: orange;height: 100px;width: 100px;}
     8 </style>
     9 <script src="jquery.js"></script>
    10 <script>
    11     $(function(){
    12         $(".box").toggle(function(){
    13             $(this).css("background-color","red");
    14         },function(){
    15             $(this).css("background-color","green");
    16         },function(){
    17             $(this).css("background-color","orange");
    18         })
    19     })
    20 </script>
    21 </head>
    22 <body>
    23     <h3>功能描述:</h3>
    24     <p>在页面中,设置一个色块,当用户第一次单机该色块时,变换其颜色,</p><p>第二次单机时,变为另一个颜色。。第三次单机是,返回第一次单机前的颜色</p>
    25     <div class="box"></div>
    26 </body>
    27 </html>

    结果如下图所示:

    高否?富否?帅否? 否? 滚去学习!
  • 相关阅读:
    结对编程-马尔科夫链作业成绩
    结对编程-四则运算(挑战出题)成绩及点评
    结对编程-四则运算成绩
    结对编程-四则运算(挑战出题)
    结对编程
    每天进步一点点-第二天卒
    每天进步一点点-深度学习入门-基于Python的理论与实现 (一)
    今天准备更新每天提高一点点系列
    Books
    WPF命令好状态刷新机制
  • 原文地址:https://www.cnblogs.com/baixc/p/3390843.html
Copyright © 2011-2022 走看看