JQuery学习(5)事件(2)

最新推荐文章于 2024-04-25 07:00:00 发布

gongth_12

最新推荐文章于 2024-04-25 07:00:00 发布

阅读量896

点赞数

分类专栏： javascript

本文链接：https://blog.csdn.net/gongth_12/article/details/8842716

版权

javascript 专栏收录该内容

25 篇文章 0 订阅

订阅专栏

本文主要介绍JQuery中的toggle事件，包括两种用法，一种是循环执行事件，另一种是交替显示隐藏。同时讲解了one事件，该事件绑定的处理函数只会执行一次。最后提到了keyup, keypress和keydown等键盘事件，用于处理按钮按下和弹起等交互。" 106521278,8043057,MySQL主从配置与Mycat读写分离实战,"['数据库管理', 'MySQL主从', 'Mycat', '读写分离', '数据库优化']

摘要由CSDN通过智能技术生成

4 toggle事件

用法一:依次执行事件到最后之后回复到第一个事件循环往复执行只有在单击元素本身时才会被触发

$('img').toggle(function () { $(this).attr('src', '风景/1.jpg') }, function () { $(this).attr('src', '风景/2.jpg') }, function () { $(this).attr('src', '风景/3.jpg') }, function () { $(this).attr('src', '风景/4.jpg') }, function () { $(this).attr('src', '风景/5.jpg') })

用法二:重复调用show()和hide()方法

$('#Button1').click(function () {
                $('img').toggle(2000);
            })

5.one事件只执行一次它所绑定的事件

$(function () {
            $('#Button1').one('click', function () {
                    $('img').toggle(2000);
                })
        })

6.keyup keypress keydown事件按钮按下弹起等事件

$('#Text1').keyup(function () {

                $('#div1').text($('#Text1').val())
            })
            $('#Text2').keydown(function () { 
                $('#div1').text($('#Text2').val())
            })
            $('#Text3').keypress(function () {
                $('#div1').text($('#Text3').val())
            })