初识Jquery（三）Jquery事件

浅浅的花香味﹌ 2022-06-02 10:39 192阅读 0赞

#### 绑定事件 ####

$(function(){ 
        $("#head li").mouseover(function(){ 
            $(this).addClass("current");//鼠标移入
        });
        $("#head li").mouseout(function(){ 
            $(this).removeClass("current");//鼠标移除
        })
    })

bind()为每个选择元素的事件绑定多个处理函数

$(function(){ 
        $("#head li").bind({
       "mouseover":function(){ 
            $(this).addClass("current");//鼠标移入
        },"mouseout":function(){ 
            $(this).removeClass("current");//鼠标移除
        })
    })

#### 切换事件 ####

hover()方法

$(function(){ 
        $("#head li").hover(function(){ 
            $(this).addClass("current");//鼠标移入
        },
        function(){ 
            $(this).removeClass("current");//鼠标移除
        })
    })

toggle()方法(jquery1.9.1以上的版本不再支持toggle()方法来依次调用n个指定的函数)

$(function(){ 
        $("img").toggle(
            function(){ 
                $(this).attr("src","1.jpg");
            },
            function(){ 
                $(this).attr("src","2.jpg");
            },
            function(){ 
                $(this).attr("src","1.jpg");
            },
        )
    })

#### 其他事件 ####

one()方法（一个仅触发一次的处理函数）

$("img").one("click",function(){ 
        $(this).attr("width","12px");
    });

trigger()方法(在选择的元素上触发指定类型的事件)

$(function(){ 
        $("#txtName").trigger("select");
    })

发表评论取消回复

表情：

评论列表（有 0 条评论，192人围观）

还没有评论，来说两句吧...

相关阅读

相关初识C#事件

文章目录一事件 1 抛砖引玉·案例 1.1工具人下楼案例 1.1.1 ToolMan.cs

偏执的太偏执、/ 2024年04月01日 10:28/ 0 赞/ 19 阅读

相关 jQuery学习笔记1——初识jQuery

1. 什么是jQuery ? jQuery 是一个兼容多浏览器的 javascript 框架。兼容CSS3。jQuery2.0及后续版本将不再支持IE6/7/8浏览器

超、凢脫俗/ 2022年08月26日 03:40/ 0 赞/ 174 阅读

相关初识jQuery的ajax

前面有一篇博文，写的是ajax请求时，[返回json字符串和json数组][json_json]的场景，今天，将原始的ajax修改为jQuery版的ajax。

亦凉/ 2022年08月08日 13:51/ 0 赞/ 174 阅读

相关 Jquery 事件

$(document).ready(function () { $('food-0').on('click', function () {

骑猪看日落/ 2022年08月02日 04:39/ 0 赞/ 136 阅读

相关初识Jquery（三）Jquery事件

绑定事件 $(function(){ $("head li").mouseover(function(){ $(thi

浅浅的花香味﹌/ 2022年06月02日 10:39/ 0 赞/ 193 阅读

相关初识Jquery（二）Jquery对象与DOM对象

Jquery对象：html() var obj = $("content); obj.html("jquery对象"); DOM对象：innerHTML()

╰半橙微兮°/ 2022年06月02日 09:24/ 0 赞/ 238 阅读

相关初识Jquery（一）

现在来每天整理一下笔记，希望以后会有点用处。今天主要是讲一个Jquery选择器吧一、js与jquery的文档就绪事件 js的文档就绪事件 window.

骑猪看日落/ 2022年06月02日 07:57/ 0 赞/ 222 阅读

相关 JQuery（学习笔记一）初识JQuery

一、JQuery语法（1）基础语法： $(selector).function() $ 定义 jQuery selector查询元素 funct

客官°小女子只卖身不卖艺/ 2022年05月15日 09:59/ 0 赞/ 239 阅读

相关 HTML-初识jQuery

jQuery简介 jQuery由美国人John Resig于2006年创建,是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaSc

比眉伴天荒/ 2022年05月12日 08:08/ 0 赞/ 285 阅读

相关 Jquery事件

<body> <button id="btn">按钮</button> <div class="block"> <button class="btn">按钮1</butt

超、凢脫俗/ 2022年03月16日 01:50/ 0 赞/ 209 阅读