A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

1.jq有哪些遍历的方法?
3.jq有哪些绑定事件的方法?
2.完成抽奖案例,将抽奖案例的代码整理成自己的话术表述

36 个回复

倒序浏览
1.jq有哪些遍历的方法?
        1. jq对象.each(callback)
              1. 语法:
                   jquery对象.each(function(index,element){});
                                        * index:就是元素在集合中的索引
                                        * element:就是集合中的每一个元素对象
                                        * this:集合中的每一个元素对象
                        2. 回调函数返回值:
                                * true:如果当前function返回为false,则结束循环(break)。
                                * false:如果当前function返回为true,则结束本次循环,继续下次循环(continue)
                2. $.each(object, [callback])
                3. for..of: jquery 3.0 版本之后提供的方式
                        for(元素对象 of 容器对象)
3.jq有哪些绑定事件的方法?
        1. jquery标准的绑定方式
                 jq对象.事件方法(回调函数);
                注意:如果调用事件方法,不传递回调函数,则会触发浏览器默认行为。
        2. on绑定事件/off解除绑定
                 jq对象.on("事件名称",回调函数)
                 jq对象.off("事件名称")
                        注意: 如果off方法不传递任何参数,则将组件上的所有事件全部解绑
        3. 事件切换:toggle
                jq对象.toggle(fn1,fn2...)
                        当单击jq对象对应的组件后,会执行fn1.第二次点击会执行fn2.....
2.完成抽奖案例,将抽奖案例的代码整理成自己的话术表述
         定义一个数组 imgs 存放图片的资源路径,利用随机数产生数组索引( Math.floor(Math.random() * 7) )。通过 “disabled”为 false 设置开始按钮的状态为可用。“disabled”为 true 设置结束按钮为不可用。
        先给开始按钮绑定单击事件,当点击开始按钮的时候,改变开始按钮状态为不可用,结束按钮为可用。触发循环定时器(setInterval),然后通过数组索引 imgs【index】 切换小相框的src属性。
        给结束按钮绑定单击事件,当点击结束按钮的时候,改变开始按钮状态为可用,结束按钮为不可用。停止定时器,通过数组索引 imgs【index】 给大相框设置src属性。
回复 使用道具 举报
1.jq有哪些遍历的方法?
答:
        方法一:使用jq对象调用each;
                格式:jquery对象.each(function(index,element){});
                        index:表示索引;
                        element:索引对应的数据,是js对象;

        方法二:全局each;
                格式:$.each(object,[callback]);
                        object:传递想要遍历的jq对象或js数组都可以;
                        callback:回调函数
                        等同于jQuery.each(object, [callback]);

        方法三:for..of;
                格式:for(变量名 of jq对象);
                        变量名等同于每个遍历出来的jq对象;
                        是jquery 3.0 版本之后提供的方式;

3.jq有哪些绑定事件的方法?
答:
        方法一:标准方式:
                格式:jq对象.事件方法(回调函数);
                        可用链式编程绑定多个;
       
        方法二:on事件绑定/off解除绑定
                on事件绑定:jq对象.on("事件名称",回调函数)
                        同时绑定多个事件,用空格分开;
                off解除绑定:jq对象.off("事件名称")
                        不写事件名称,则默认解除所有事件绑定;

        方法三:事件切换
                格式:jq对象.toggle(fn1,fn2...)
                        每点击一次,就切换一次执行方法;
                        切换方式:按定义的回调函数,依次顺序循环执行;
                       
2.完成抽奖案例,将抽奖案例的代码整理成自己的话术表述
答:
       
        定义一个一维数组,用来存放图片的路径;
        给开始按钮绑定事件:
                定义一个循环定时器,让其每过一段时间,就执行一次,完成自动切换的效果;
                每次循环先在0-6中随机一个数,然后对照数组,找出响应的图片路径,让其显示在小相框中,完成图片切换功能;
        给结束按钮绑定事件:
                先停止循环定时器,停止小相框里图片的切换;
                然后将此时小相框图片展示在大相框上(根据此时随机出来的数,去对照数组)完成结果的展示;
回复 使用道具 举报
王佳盛


1.jq有哪些遍历的方法?
(1)jq对象.each(callback)。callback:对于每个匹配的元素所要执行的函数
(2)$.each(object, [callback])。callback:对于每个匹配的元素所要执行的函数
(3)for..of:  jquery 3.0 版本之后提供的方式

2.jq有哪些绑定事件的方法?
(1)JQ对象.事件(事件要执行的函数);
(2)JQ对象.on(“事件名称”,要执行的函数);
(3)JQ对象.toggle(fn…): 用于绑定两个或多个事件处理器函数,以响应被选元素的轮流的 click 事件

3.完成抽奖案例,将抽奖案例的代码整理成自己的话术表述
(1)将图片路径存储到imgs集合中
(2)为“开始”和“结束”按钮绑定单击事件
(3)在“开始”按钮绑定的函数中创建一个循环定时器,定时执行根据随机生成的索引切换小相框中的图片的函数。
(4)在“结束”按钮绑定的函数中关闭循环定时器。并且大相框展示小相框中的图片
(5)对两个按钮进行细节处理。
回复 使用道具 举报
1.jq有哪些遍历的方法?
答:1).jq对象.each(callback)
        2).$.each(object,[callback])
        3).for ...of  JQuery3.0版本后提供的方法
2.jq有哪些绑定事件的方法?
答:1) jquery标准的绑定方式
      2.)on绑定事件/off解除绑定
      3) 事件切换:toggle(fn1,fn2...)当单击jq对象对应的组件后,会执行fn1.第二次点击会执行fn2.....
3.完成抽奖案例,将抽奖案例的代码整理成自己的话术表述
答:首先定义一个图片的路径数组,然后定义入口函数,绑定开始按钮的点击事件和停止按钮的点击事件,在开始按钮的事件中首先定义一个循环定时器,再通过Math类中的random和floor方法随机获取图片数组的索引值,然后让小相框的img中的src属性等于获取到的图片;在停止按钮的事件中首先设置一个关闭开始按钮事件中的循环定时器,然后让大相框中的img的src属性等于小相框的图片。
优化:分别在点击事件的开始和入口函数的开始设置按钮是否可用(disabled属性true或false)。
回复 使用道具 举报
1.jq有哪些遍历的方法?
jq对象.each(function(index,element){})
$.each(jq对象,function(index,element){})
for(element of 遍历的对象)

3.jq有哪些绑定事件的方法?
jq对象.事件方法(回调函数);
jq对象.on("事件名称",回调函数)
jq对象.toggle(fn1,fn2)->绑定多个事件,点击切换

2.完成抽奖案例,将抽奖案例的代码整理成自己的话术表述
1.创建存多个图片路径的数组
2.开始按钮和结束按钮绑定点击事件
3.开始按钮点击事件方法内,设定循环计时器
4.计时器方法内获取数组随机索引,修改小框图片属性
5.结束按钮事件方法内结束计时器,修改大框图片属性
回复 使用道具 举报
omasoo 中级黑马 2019-5-11 21:12:20
7#
本帖最后由 omasoo 于 2019-5-11 21:42 编辑

李伟斌

1.jq有哪些遍历的方法?
答:有三种,分别是
a.jquery对象.each(function(index,element){});
b.$.each(object, [callback])
c.for(元素对象 of 容器对象)
2.jq有哪些绑定事件的方法?
答:a.jquery标准的绑定方式
       b.on绑定事件/off解除绑定
        * jq对象.on("事件名称",回调函数)
        * jq对象.off("事件名称")
       c.事件切换:toggle
        * 当单击jq对象对应的组件后,会执行fn1.第二次点击会执行fn2.....
3.完成抽奖案例,将抽奖案例的代码整理成自己的话术表述
答:1. 给开始按钮绑定单击事件   $("#startID").click(function () {}
                    1.1 定义循环定时器    startId = setInterval(function () {}
                    1.2 切换小相框的src属性
                        1.2.1 生成随机数。        index = Math.floor(Math.random() * 7)
                1.2.2 定义数组,存放图片资源路径      $("#img1ID").prop("src",imgs[index]);


                2. 给结束按钮绑定单击事件    $("#stopID").click(function () {}
                    1.1 停止定时器       clearInterval(startId);
                    1.2 给大相框设置src属性      $("#img2ID").prop("src",imgs[index]).show();

其他:将抽奖的图片封装成数组
          优化开始和结束按钮: $("#startID").prop("disabled",false);$("#stopID").prop("disabled",true);或
                                            $("#startID").prop("disabled",true);$("#stopID").prop("disabled",false);
                        disabled",true表示按钮不可按,disabled",false表示按钮可按。
回复 使用道具 举报
1.jq有哪些遍历的方法?
(1)jq对象.each(callback)
(2) $.each(object, [callback])
(3)for..of: jquery 3.0 版本之后提供的方式

2.jq有哪些绑定事件的方法?
(1) jquery标准方法: jq对象.事件方法(回调函数);
(2) on绑定事件/off解除绑定:
jq对象.on("事件名称",回调函数)
jq对象.off("事件名称")
(3)事件切换:toggle:jq对象.toggle(fn1,fn2...)

3.完成抽奖案例,将抽奖案例的代码整理成自己的话术表述
首先要创建一个数组,数组的内容是相片的路径,然后为开始和停止按钮绑定单击事件,定义一个循环定时器,当点下开始按钮时循环定时器启动,设置随机角标和相框里的src属性让照片循环起来,src属性对应的就是数组里数据的索引,这个索引能让我们找到数组的第几个照片。当我们按下停止按钮时循环定时器停止设种子大相框的src属性让大相框里的照片和小相框里的照片一样。
回复 使用道具 举报

1.jq有哪些遍历的方法?
(1)使用jq对象调用each;
                格式:jquery对象.each(function(index,element){});
                        index:表示索引;
                        element:索引对应的数据,是js对象;
(2)全局each;
                格式:$.each(object,[callback]);
                        object:传递想要遍历的jq对象或js数组都可以;
                        callback:回调函数
                        等同于jQuery.each(object, [callback]);
(3)for..of;
                格式:for(变量名 of jq对象);
                        变量名等同于每个遍历出来的jq对象;
                        是jquery 3.0 版本之后提供的方式;

3.jq有哪些绑定事件的方法?
(1)jq对象.事件方法(回调函数);
(2)jq对象.on("事件名称",回调函数)
(3)jq对象.toggle(fn1,fn2)->可绑定多个事件,当点击次数超过事件数时,会进入循环来回切换。

2.完成抽奖案例,将抽奖案例的代码整理成自己的话术表述
首先定义一个存放图片资源路径数组,设置入口函数, 设置按钮初始状态 ,给开始按钮绑定单击事件,再次设定按钮状态 定义循环定时器,循环定时器内获取一个范围在0到数组长度-1的随机数作为数组索引,改变小图框的图片资源路径。给停止按钮绑定单击事件,设定按钮状态,结束定时器,改变大图框的图片资源路径与小图框的相同。
回复 使用道具 举报
1.jq有哪些遍历的方法?
1)jq对象.each(callback):
        1. 语法:
            jquery对象.each(function(index,element){});
                   * index:就是元素在集合中的索引
                   * element:就是集合中的每一个元素对象(代表js对象,也可以是this)   
         2. 回调函数返回值:
                   * true:如果当前function返回为false,则结束循环(break)。
                   * false:如果当前function返回为true,则结束本次循环,继续下次循环(continue)
2)$.each(object, [callback])
        第一个参数为被遍历的对象
        第二个参数回调函数可以写为【(function(index,element){});】
3)for(元素对象 of 容器对象),是3.0版本之后提供的方式。

2.jq有哪些绑定事件的方法?
1)jquery标准的绑定方式:
       *jq对象.事件方法(回调函数)。如果调用事件方法,不传递回调函数,则会触发浏览器默认行为。
2)on绑定事件/off解除绑定
       *jq对象.on("事件名称",回调函数)
       *jq对象.off("事件名称")。如果off方法不传递任何参数,则将组件上的所有事件全部解绑
3)事件切换:toggle
       *jq对象.toggle(fn1,fn2...)。当单击jq对象对应的组件后,会执行fn1.第二次点击会执行fn2.....
       *注意:1.9版本 .toggle() 方法被删除,jQuery Migrate(迁移)插件可以恢复此功能。需要引入 <scriptsrc="../js/jquery-migrate-        1.0.0.js" type="text/javascript"charset="utf-8"></script>

3.完成抽奖案例,将抽奖案例的代码整理成自己的话术表述
1.给开始按钮绑定单击事件,调用循环定时器setInterval()方法,设置循环定时器,第一个参数使用匿名函数,第二个参数传递毫秒值。匿名函数内生成一个随机角标( Math.floor(Math.random() * 7) )作为数组的索引,之后获取小相框的img对象,使用prop()方法设置属性src,ings[随机角标]
        (1)由于停止按钮中的停止循环定时器方法需要参数明确是停止那个定时器,参数为开始定时器的返回值,所以需要提升开始定时器的返回值的作用域,
        (2)大相框的图片需要与小相框的图片相同,随机生成的角标变量名也需要提升作用域,让其可以获得相同的图片
2.停止按钮绑定单击事件,停止循环定时器调用clearInterval()方法,替换大相框的属性,和小相框设置方法一致
3.优化:(1)通过设置按钮的disabled属性来完成按钮的点击状态
        (2)停止按钮中大相框图片显示样式可以通过设置动画获得更好的显示样式,先将图片隐藏(调用hide()),然后调用显示动画的样式show()、slideDown()、fadeIn()等方法
回复 使用道具 举报
1.jq有哪些遍历的方法?
三种:①q对象.each(function(index,element){})   ② $.each(function(index,element){})  ③ for(元素对象 of 容器对象)3.0版本之后提供的

2.jq有哪些绑定事件的方法?
        ①jq对象.事件方法(回调函数)
        ②on绑定事件/off解除绑定  off方法不传递任何参数,则所有事件全部解绑
        ③事件切换:jq对象.toggle(fn1,fn2....):执行fn1完会执行fn2...
       
3.完成抽奖案例,将抽奖案例的代码整理成自己的话术表述
案例分析:
①首先需要创建一个数组imgs用来存放图片
②给开始和停止按钮绑定单机事件
                分别给开始按钮设置循环定时器和停止按钮结果定时器
                ①开始按钮中要给小相框src固有属性设置属性
                ②要随机选择imgs数组中的一个图片:用生成角标的方式获取
                ③停止按钮中要给大相框设置src属性
③给开始和停止按钮标记是否可用
        页面刚开始的时候停止按钮的不可用的所以开始按钮为false,停止按钮为true
        点击完开始按钮,开始按钮不可用所以开始按钮为true,停止按钮为false
        点击完停止按钮,停止按钮不可用就跟页面刚开始的时候一样
注意事项:为了停止按钮能获取到循环定时器对象用来结束,要在入口函数外定义循环定时器对象名
还有为了停止按钮时给大相框获取到随机角标,角标的返回值也要定义在入口函数外
回复 使用道具 举报
1.jq有哪些遍历的方法?
答:jq有三种遍历方法:
①通过jq的对象调用方法进行遍历:citys.each(function(index,element) {});
②通过JQuery全局对象方法进行遍历:$.each(citys,function(index,element) {});
③使用3.0版本的for...of方法进行遍历:for(city of citys) {};

2.jq有哪些绑定事件的方法?
答:jq有两种绑定事件的方法:
①标准绑定:jq对象.事件方法(回调函数);
②通过on方法绑定:jq对象.on("事件名称",回调函数)

3.完成抽奖案例,将抽奖案例的代码整理成自己的话术表述
答:
前期准备:
1. 搭建静态页面框架:大相框,小相框,开始按钮,停止按钮
2. 将待抽奖的图片地址打包成一个图片数组
逻辑代码:
3. 给开始按钮绑定单击事件:
        ①调用循环定时器setInterval,设定函数和周期
        ②在循环内通过Math.random方法获取一个随机数,随机数小于图片数组的长度
        ③将小相框的图片地址周期性地改成图片数组中随机数对应索引位置的图片地址
4. 给结束按钮绑定单击事件:
        ①调用clearInterval方法停止定时器
        ②将大相框的图片地址修改为停止时小相框对应的图片地址
效果优化:
5. 在开始前,对停止按钮设定禁用效果;在开始后对开始按钮设定禁用效果
6. 对停止后大相框的图片展示效果进行优化,大相框获取图片地址后先隐藏图片,再通过show()方法展示
回复 使用道具 举报

1.jq有哪些遍历的方法?
答:
        方法一:使用jq对象调用each;
                格式:jquery对象.each(function(index,element){});
                        index:表示索引;
                        element:索引对应的数据,是js对象;

        方法二:全局each;
                格式:$.each(object,[callback]);
                        object:传递想要遍历的jq对象或js数组都可以;
                        callback:回调函数
                        等同于jQuery.each(object, [callback]);

        方法三:for..of;
                格式:for(变量名 of jq对象);
                        变量名等同于每个遍历出来的jq对象;
                        是jquery 3.0 版本之后提供的方式;

3.jq有哪些绑定事件的方法?
答:
        方法一:标准方式:
                格式:jq对象.事件方法(回调函数);
                        可用链式编程绑定多个;
        
        方法二:on事件绑定/off解除绑定
                on事件绑定:jq对象.on("事件名称",回调函数)
                        同时绑定多个事件,用空格分开;
                off解除绑定:jq对象.off("事件名称")
                        不写事件名称,则默认解除所有事件绑定;

        方法三:事件切换
                格式:jq对象.toggle(fn1,fn2...)
                        每点击一次,就切换一次执行方法;
                        切换方式:按定义的回调函数,依次顺序循环执行;
                        
2.完成抽奖案例,将抽奖案例的代码整理成自己的话术表述
答:
        
        定义一个一维数组,用来存放图片的路径;
        给开始按钮绑定事件:
                定义一个循环定时器,让其每过一段时间,就执行一次,完成自动切换的效果;
                每次循环先在0-6中随机一个数,然后对照数组,找出响应的图片路径,让其显示在小相框中,完成图片切换功能;
        给结束按钮绑定事件:
                先停止循环定时器,停止小相框里图片的切换;
                然后将此时小相框图片展示在大相框上(根据此时随机出来的数,去对照数组)完成结果的展示;
回复 使用道具 举报
1.jq有哪些遍历的方法?

1.1   JQ对象.each

1.2   JQ($).each

1.3   for (变量名 of jq对象)

2.jq有哪些绑定事件的方法?

2.1   jq对象.事件方法(回调函数);

2.2   on绑定事件/off解除绑定

2.3  事件切换:toggle

3.完成抽奖案例,将抽奖案例的代码整理成自己的话术表述:

先在入口函数外边提升index和循环定时器对象的作用域

1.给开始按钮绑定单击事件:

1.1设置开始循环时按钮是否可用

1.2设置循环定时器,每20毫秒切换一次图片

1.3设置随机角标0-6的图片索引

1.4给小相框修改src属性



2.给结束按钮绑定单击事件:

2.1设置开始循环时按钮是否可用

2.2停止图片循环

2.3给大相框修改src属性
回复 使用道具 举报

1.jq有哪些遍历的方法?
答:
        方法一:使用jq对象调用each;
                格式:jquery对象.each(function(index,element){});
                        index:表示索引;
                        element:索引对应的数据,是js对象;

        方法二:全局each;
                格式:$.each(object,[callback]);
                        object:传递想要遍历的jq对象或js数组都可以;
                        callback:回调函数
                        等同于jQuery.each(object, [callback]);

        方法三:for..of;
                格式:for(变量名 of jq对象);
                        变量名等同于每个遍历出来的jq对象;
                        是jquery 3.0 版本之后提供的方式;

3.jq有哪些绑定事件的方法?
答:
        方法一:标准方式:
                格式:jq对象.事件方法(回调函数);
                        可用链式编程绑定多个;
        
        方法二:on事件绑定/off解除绑定
                on事件绑定:jq对象.on("事件名称",回调函数)
                        同时绑定多个事件,用空格分开;
                off解除绑定:jq对象.off("事件名称")
                        不写事件名称,则默认解除所有事件绑定;

        方法三:事件切换
                格式:jq对象.toggle(fn1,fn2...)
                        每点击一次,就切换一次执行方法;
                        切换方式:按定义的回调函数,依次顺序循环执行;
                        
2.完成抽奖案例,将抽奖案例的代码整理成自己的话术表述
答:
        
        定义一个一维数组,用来存放图片的路径;
        给开始按钮绑定事件:
                定义一个循环定时器,让其每过一段时间,就执行一次,完成自动切换的效果;
                每次循环先在0-6中随机一个数,然后对照数组,找出响应的图片路径,让其显示在小相框中,完成图片切换功能;
        给结束按钮绑定事件:
                先停止循环定时器,停止小相框里图片的切换;
                然后将此时小相框图片展示在大相框上(根据此时随机出来的数,去对照数组)完成结果的展示;
回复 使用道具 举报
1.jq有哪些遍历的方法?
        1. jq对象.each(callback)
        2. $.each(object, [callback]),jQuery.each(object, [callback])
       3. for..of : for(元素对象 of 容器对象), jquery 3.0 版本之后提供的方式
                       
3.jq有哪些绑定事件的方法?
          1. jquery标准的绑定方式: jq对象.事件方法(回调函数);
          2. on绑定事件/off解除绑定
                * jq对象.on("事件名称",回调函数)
                * jq对象.off("事件名称")
         3. 事件切换:toggle
                * jq对象.toggle(fn1,fn2...)

2.完成抽奖案例,将抽奖案例的代码整理成自己的话术表述
    1.给开始按钮绑定单击事件
             1.1定义循环定时器
              1.2生成随机索引
              1.3设置小相框的src属性
  2.给结束按钮绑定单击事件
          2.1  停止定时器
          2.2 给大相框设置src属性
回复 使用道具 举报
李伟斌

1.jq有哪些遍历的方法?
答:有三种,分别是
a.jquery对象.each(function(index,element){});
b.$.each(object, [callback])
c.for(元素对象 of 容器对象)
2.jq有哪些绑定事件的方法?
答:a.jquery标准的绑定方式
       b.on绑定事件/off解除绑定
        * jq对象.on("事件名称",回调函数)
        * jq对象.off("事件名称")
       c.事件切换:toggle
        * 当单击jq对象对应的组件后,会执行fn1.第二次点击会执行fn2.....
3.完成抽奖案例,将抽奖案例的代码整理成自己的话术表述
答:1. 给开始按钮绑定单击事件   $("#startID").click(function () {}
                    1.1 定义循环定时器    startId = setInterval(function () {}
                    1.2 切换小相框的src属性
                        1.2.1 生成随机数。        index = Math.floor(Math.random() * 7)
                1.2.2 定义数组,存放图片资源路径      $("#img1ID").prop("src",imgs[index]);
                        

                2. 给结束按钮绑定单击事件    $("#stopID").click(function () {}
                    1.1 停止定时器       clearInterval(startId);
                    1.2 给大相框设置src属性      $("#img2ID").prop("src",imgs[index]).show();

其他:将抽奖的图片封装成数组
          优化开始和结束按钮: $("#startID").prop("disabled",false);$("#stopID").prop("disabled",true);或
                                            $("#startID").prop("disabled",true);$("#stopID").prop("disabled",false);
                        disabled",true表示按钮不可按,disabled",false表示按钮可按。
回复 使用道具 举报

1.jq有哪些遍历的方法?
        1).jq对象.each(callback)
        2).$.each(object,[callback])
        3).for ...of
        4).for循环
3.jq有哪些绑定事件的方法?
        多个事件绑定同一个函数
        多个事件绑定不同函数
        用on()方法绑定多个选择器
        绑定自定义事件
        如果需要移除on()所绑定的方法,可以使用off()方法处理。
2.完成抽奖案例,将抽奖案例的代码整理成自己的话术表述
        给开始按钮和结束按钮绑定单击事件,定义循环定时器设置20毫秒执行一次,处理按钮是否可以使用的效果(两个按钮同时只能有一个可以点击),调用数学函数中的random函数获取0-6.999随机数,再调用floor函数进行向下取整,设置小相框的src属性。在结束按钮事件中停止定时器,给大相框设置src属性,显示1秒之后。
回复 使用道具 举报
1.jq有哪些遍历的方法?
1)jq对象.each(callback):
       Callback是回调函数,可以有参数和返回值。若返回true,则结束本次循环,继续下次循环(相当于continue);返回false,则结束循环 (相当于break)。
2)$.each(object, [callback])
3)for(元素对象 of 容器对象),是3.0版本之后提供的方式。
3.jq有哪些绑定事件的方法?
1)jquery标准的绑定方式:
       *jq对象.事件方法(回调函数)。如果调用事件方法,不传递回调函数,则会触发浏览器默认行为。
2)on绑定事件/off解除绑定
       *jq对象.on("事件名称",回调函数)
       *jq对象.off("事件名称")。如果off方法不传递任何参数,则将组件上的所有事件全部解绑
3)事件切换:toggle
       *jq对象.toggle(fn1,fn2...)。当单击jq对象对应的组件后,会执行fn1.第二次点击会执行fn2.....
       *注意:1.9版本 .toggle() 方法被删除,jQuery Migrate(迁移)插件可以恢复此功能。需要引入 <scriptsrc="../js/jquery-migrate-1.0.0.js" type="text/javascript"charset="utf-8"></script>
2.完成抽奖案例,将抽奖案例的代码整理成自己的话术表述
开始按钮:给开始按钮绑定单击事件。当点击开始按钮,则先调用setInterval()方法,设置循环计时器,每个20毫秒执行一次换图片的方法。在换图片的方法内,首先获取一个随机数作为图片数组(imgs)的索引,之后将小像框的img标签的src属性设置为对应的图片路径。
       停止按钮:给停止按钮绑定单击事件。当点击停止按钮时,首先调用clearInterval()方法,停止循环计时器。接着在大相框中切换选中的图片,即将img标签的src属性设置为对应的图片路径。
       若有需要,则可以将开始按钮和停止按钮分别在页面加载完成、点击开始按钮、点击停止按钮这三种情况下设置相应的权限。例如页面加载完成时只能点击开始按钮而不能点击停止按钮。
       可以在停止按钮的单击事件中,先将图片隐藏(调用hide()),然后调用show()方法以动画的形式出现。
       setInterval()方法有返回值,停止计时时将该返回值传入clearInterval()方法即可。不过需要将该返回值的作用域提升,以便在不同的方法内使用。
在开始按钮的单击事件中产生的随机数同样需要提升作用域,以便在停止按钮的单击事件中使用。
回复 使用道具 举报
1.jq有哪些遍历的方法?

       
        第一种:js遍历与JAVA普通for循环一样

        第二种:jq对象.each(callback)
                callback回调函数可以定义
                        1。this.方法(该jq对象调用方法)
                        2。定义参数可以是索引,元素,键,值 等多种

        第三种:$.each(object, [callback])
                        callback回调函数参考第一种

        第四种:for...of: jquery(了解,了解,了解)
                JQuery 3.0提供的用法类似于增for

        注意:
                1。第二种和第三种遍历是有些区别的。一个是jq对象一个是object
                2。循环内定义if:return如果是true相当于break,如果是fales相当于continue
                3。jq提方法比js多,转换格式:$(转换的js对象)


3.jq有哪些绑定事件的方法?

        第一种:jquery标准的绑定方式
                * jq对象.事件方法(回调函数);
                * jq对象.事件方法1(回调函数),事件方法2(回调函数)...;//链式编程
                        * 注:如果调用事件方法,不传递回调函数,则会触发浏览器默认行为。
               
        第二种:on绑定事件/off解除绑定
                * jq对象.on("事件名称",回调函数)
                * jq对象.off("事件名称")
                        * 如果off方法不传递任何参数,则将组件上的所有事件全部解绑

        第三种:事件切换:toggle
                * jq对象.toggle(fn1,fn2...)
                        * 当单击jq对象对应的组件后,会执行fn1.第二次点击会执行fn2.....
                        * 当执行完最后的fn会返回执行fn1

        * 注意:1.9版本后 .toggle() 方法删除,jQuery Migrate(迁移)插件可以恢复此功能。
                导入方法等同于导入jquery.js文件
                <script src="../js/jquery-migrate-1.0.0.js" type="text/javascript" charset="utf-8"></script>



2.完成抽奖案例,将抽奖案例的代码整理成自己的话术表述
       
        页面结构:小相框,大相框,开始按钮,停止按钮
        1.给"开始按钮"绑定单击事件
                1.1定义循环定时器,定时器内部定义:1.随机脚标2.小相框切换属性
                        *在函数入口外定义图片数组
                       
        当点击开始按钮执行图片切换由定时器的时间作为切换每一张图的时间,改图片切换循环是由随机数生成的索引(脚标)对应的图片

        2.给"停止按钮"绑定单击事件
                1.1停止定时器
                1.2给大相框及小相框定义属性:
       
        当点击停止按钮他停止定时器,然后通过随机数生成的索引定义大相框及小相框所对应的图片
        注意:
                1.定时器及随机脚标初始化在函数入口外否则获取不到同一个定时器随机脚标变量(作用域限制)

回复 使用道具 举报
12下一页
您需要登录后才可以回帖 登录 | 加入黑马