• 关注官方微信 微信公众号 添加方式:
    1:搜索微信号(gogolinux
    2:扫描左侧二维码
  • 登录 注册
  • 一起学LINUX - GOGOLINUX

    查看: 266|回复: 0
    打印 上一主题 下一主题

    jQuery事件

    [复制链接]

    3

    主题

    3

    帖子

    20

    积分

    新手上路

    Rank: 1

    积分
    20
    跳转到指定楼层
    楼主
    发表于 2020-1-27 00:32:28 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式
    jQuery 是为事件处理特别设计的。
    什么是事件?
    页面对不同访问者的响应叫做事件。
    事件处理程序指的是当 HTML 中发生某些事件时所调用的方法。
    实例:
    在元素上移动鼠标。
    选取单选按钮
    点击元素
    在事件中经常使用术语"触发"(或"激发")例如: "当您按下按键时触发 keypress 事件"。
    常见 DOM 事件:
    jQuery 事件方法语法
    在 jQuery 中,大多数 DOM 事件都有一个等效的 jQuery 方法。
    页面中指定一个点击事件:
    $("p").click;
    下一步是定义什么时间触发事件。您可以通过一个事件函数实现:
    $("p").click(function{ // 动作触发后执行的代码!! });
    常用的 jQuery 事件方法
    $(document).ready
    $(document).ready 方法允许我们在文档完全加载完后执行函数。该事件方法在 jQuery 语法 章节中已经提到过。
    click
    click 方法是当按钮点击事件被触发时会调用一个函数。
    该函数在用户点击 HTML 元素时执行。

    在下面的实例中,当点击事件在某个
    元素上触发时,隐藏当前的  元素:
    实例
    $("p").click(function{ $(this).hide; });
    尝试一下 »
    dblclick
    当双击元素时,会发生 dblclick 事件。
    dblclick 方法触发 dblclick 事件,或规定当发生 dblclick 事件时运行的函数:
    实例
    $("p").dblclick(function{ $(this).hide; });
    尝试一下 »
    mouseenter
    当鼠标指针穿过元素时,会发生 mouseenter 事件。
    mouseenter 方法触发 mouseenter 事件,或规定当发生 mouseenter 事件时运行的函数:
    实例
    $("#p1").mouseenter(function{ alert('您的鼠标移到了 id="p1" 的元素上!'); });
    尝试一下 »
    mouseleave
    当鼠标指针离开元素时,会发生 mouseleave 事件。
    mouseleave 方法触发 mouseleave 事件,或规定当发生 mouseleave 事件时运行的函数:
    实例
    $("#p1").mouseleave(function{ alert("再见,您的鼠标离开了该段落。"); });
    尝试一下 »
    mousedown
    当鼠标指针移动到元素上方,并按下鼠标按键时,会发生 mousedown 事件。
    mousedown 方法触发 mousedown 事件,或规定当发生 mousedown 事件时运行的函数:
    实例
    $("#p1").mousedown(function{ alert("鼠标在该段落上按下!"); });
    尝试一下 »
    mouseup
    当在元素上松开鼠标按钮时,会发生 mouseup 事件。
    mouseup 方法触发 mouseup 事件,或规定当发生 mouseup 事件时运行的函数:
    实例
    $("#p1").mouseup(function{ alert("鼠标在段落上松开。"); });
    尝试一下 »
    hover
    hover方法用于模拟光标悬停事件。
    当鼠标移动到元素上时,会触发指定的第一个函数(mouseenter);当鼠标移出这个元素时,会触发指定的第二个函数(mouseleave)。
    实例
    $("#p1").hover( function{ alert("你进入了 p1!"); }, function{ alert("拜拜! 现在你离开了 p1!"); } );
    尝试一下 »
    focus
    当元素获得焦点时,发生 focus 事件。
    当通过鼠标点击选中元素或通过 tab 键定位到元素时,该元素就会获得焦点。
    focus 方法触发 focus 事件,或规定当发生 focus 事件时运行的函数:
    实例
    $("input").focus(function{ $(this).css("background-color","#cccccc"); });
    尝试一下 »
    blur
    当元素失去焦点时,发生 blur 事件。
    blur 方法触发 blur 事件,或规定当发生 blur 事件时运行的函数:
    实例
    $("input").blur(function{ $(this).css("background-color","#ffffff"); });
    分享到:
    您需要登录后才可以回帖 登录 | 立即注册

    本版积分规则

    官方微博:

    官方头条号:

    官方微信

    手机访问:

    官方微信

    QQArchiver 手机版 小黑屋 一起学LINUX - GOGOLINUX 闽ICP备18025837号-1 Discuz! X3.4 Powered by © 2001-2013 Comsenz Inc. 

    yabovip入口本站资源均来自互联网或会员发布,如果侵犯了您的权益请与我们联系,我们将在24小时内删除!谢谢!

    快速回复 快速发帖 返回顶部 返回列表