热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

jQuery选择器与鼠标事件入门指南

本文介绍了jQuery的基本使用方法,包括文档就绪函数和常用的鼠标事件处理,以及各种选择器的详细说明。

jQuery 是一个轻量级的 Javascript 库,用于简化 HTML 文档的遍历和操作。其基本使用形式如下:

$(document).ready(function(){ $("button").click(function(){ $("#test").hide(); }); });

这段代码的作用是在文档加载完成后,当用户点击按钮时,隐藏 ID 为 test 的元素。

以下是一些常用的 jQuery 选择器:

  • $("*") - 选择所有元素
  • $(this) - 选择当前元素
  • $("p.intro") - 选择所有 class 为 intro 的 p 元素
  • $("p#other") - 选择所有 id 为 other 的 p 元素
  • $("p:first") - 选择第一个 p 元素
  • $("ul li:first") - 选择第一个 ul 元素的第一个 li 元素
  • $("ul li:first-child") - 选择每个 ul 的第一个子元素
  • $("[href]") - 选择所有带有 href 属性的元素
  • $("a[target='_blank']") - 选择所有 target 为 _blank 的 a 元素
  • $("a[target!='_blank']") - 选择所有 target 不为 _blank 的 a 元素
  • $(":button") - 选择所有 button 元素及 input 类型为 button 的元素
  • $("tr:even") - 选择所有偶数行 tr 元素
  • $("tr:odd") - 选择所有奇数行 tr 元素

以下是一些常用的鼠标事件:

  • dblclick() - 当双击某个 HTML 标记时调用。例如,以下代码在双击 p 元素时隐藏其内容:
    $("p").dblclick(function(){
      $(this).hide();
    });
  • mouseenter() - 当鼠标进入某个 HTML 元素时触发。例如:
    $("#p1").mouseenter(function(){
      alert("You entered p1!");
    });
  • mouseleave() - 当鼠标离开某个 HTML 元素时触发。例如:
    $("#p1").mouseleave(function(){
      alert("Bye! You now leave p1!");
    });
  • mousedown() - 当按下鼠标左键时触发。例如:
    $("#p1").mousedown(function(){
      alert("Mouse down over p1!");
    });
  • mouseup() - 当在某个元素上释放鼠标左键时触发。例如:
    $("#p1").mouseup(function(){
      alert("Mouse up over p1!");
    });

参考资料:https://www.cnblogs.com/yxfcnbg/p/3297871.html


推荐阅读
  • 在现代Web应用中,当用户滚动到页面底部时,自动加载更多内容的功能变得越来越普遍。这种无刷新加载技术不仅提升了用户体验,还优化了页面性能。本文将探讨如何实现这一功能,并介绍一些实际应用案例。 ... [详细]
  • 前言--页数多了以后需要指定到某一页(只做了功能,样式没有细调)html ... [详细]
  • 尽管使用TensorFlow和PyTorch等成熟框架可以显著降低实现递归神经网络(RNN)的门槛,但对于初学者来说,理解其底层原理至关重要。本文将引导您使用NumPy从头构建一个用于自然语言处理(NLP)的RNN模型。 ... [详细]
  • 技术分享:从动态网站提取站点密钥的解决方案
    本文探讨了如何从动态网站中提取站点密钥,特别是针对验证码(reCAPTCHA)的处理方法。通过结合Selenium和requests库,提供了详细的代码示例和优化建议。 ... [详细]
  • 本文详细介绍了如何在Linux系统上安装和配置Smokeping,以实现对网络链路质量的实时监控。通过详细的步骤和必要的依赖包安装,确保用户能够顺利完成部署并优化其网络性能监控。 ... [详细]
  • 本文深入探讨 MyBatis 中动态 SQL 的使用方法,包括 if/where、trim 自定义字符串截取规则、choose 分支选择、封装查询和修改条件的 where/set 标签、批量处理的 foreach 标签以及内置参数和 bind 的用法。 ... [详细]
  • 本章将深入探讨移动 UI 设计的核心原则,帮助开发者构建简洁、高效且用户友好的界面。通过学习设计规则和用户体验优化技巧,您将能够创建出既美观又实用的移动应用。 ... [详细]
  • 本文详细解析了Python中的os和sys模块,介绍了它们的功能、常用方法及其在实际编程中的应用。 ... [详细]
  • 本文探讨了如何在给定整数N的情况下,找到两个不同的整数a和b,使得它们的和最大,并且满足特定的数学条件。 ... [详细]
  • 基于KVM的SRIOV直通配置及性能测试
    SRIOV介绍、VF直通配置,以及包转发率性能测试小慢哥的原创文章,欢迎转载目录?1.SRIOV介绍?2.环境说明?3.开启SRIOV?4.生成VF?5.VF ... [详细]
  • 基于JQuery实现的评分插件
    本文介绍了一个使用JQuery创建的交互式评分控件。当用户将鼠标悬停在星星上时,左侧的星星会变为实心,右侧保持空心,并显示对应的评分等级;移开鼠标后,所有星星恢复为空心状态。 ... [详细]
  • 本文将介绍如何编写一些有趣的VBScript脚本,这些脚本可以在朋友之间进行无害的恶作剧。通过简单的代码示例,帮助您了解VBScript的基本语法和功能。 ... [详细]
  • 1.如何在运行状态查看源代码?查看函数的源代码,我们通常会使用IDE来完成。比如在PyCharm中,你可以Ctrl+鼠标点击进入函数的源代码。那如果没有IDE呢?当我们想使用一个函 ... [详细]
  • 使用 Azure Service Principal 和 Microsoft Graph API 获取 AAD 用户列表
    本文介绍了一段通用代码示例,该代码不仅能够操作 Azure Active Directory (AAD),还可以通过 Azure Service Principal 的授权访问和管理 Azure 订阅资源。Azure 的架构可以分为两个层级:AAD 和 Subscription。 ... [详细]
  • 本文详细介绍了Akka中的BackoffSupervisor机制,探讨其在处理持久化失败和Actor重启时的应用。通过具体示例,展示了如何配置和使用BackoffSupervisor以实现更细粒度的异常处理。 ... [详细]
author-avatar
菜鸟一号
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有