JavaQuery事件处理

最新推荐文章于 2021-02-26 07:38:29 发布
最新推荐文章于 2021-02-26 07:38:29 发布
阅读量3.2k 收藏 1
点赞数
分类专栏： JQuery 文章标签： JavaQuery事件处理
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/testguess/article/details/38080695
版权

1、bind() 方法为被选元素添加一个或多个事件处理程序，并规定事件发生时运行的函数。

  语法：$(selector).bind({event:function, event:function, ...})

       event            必需。规定添加到元素的一个或多个事件.由空格分隔多个事件。必须是有效的事件。
       data             可选。规定传递到函数的额外数据。
       function         必需。规定当事件发生时运行的函数。

<span style="white-space:pre">	</span><span style="font-family:Courier New;font-size:14px;"><script type="text/javascript">
<span style="white-space:pre">	</span>    $(document).ready(function(){
 <span style="white-space:pre">	</span>      $("button").bind({
<span style="white-space:pre">	</span>       click:function(){$("p").slideToggle();},
<span style="white-space:pre">	</span>       mouseover:function(){$("body").css("background-color","red");},  
<span style="white-space:pre">	</span>       mouseout:function(){$("body").css("background-color","#FFFFFF");}  
 <span style="white-space:pre">	</span>      });
<span style="white-space:pre">	</span>    });
     </script></span>
<span style="font-family:Courier New;font-size:14px;">     <body>
      <p>This is a paragraph.</p>
      <button>请点击这里</button>
     </body></span>


2、blur()当元素失去焦点时发生 blur 事件。
   blur() 函数触发 blur 事件，或者如果设置了 function 参数，该函数也可规定当发生 blur 事件时执行的代码。
   提示：早前，blur 事件仅发生于表单元素上。在新浏览器中，该事件可用于任何元素。

   语法：$(selector).blur(function)

<span style="font-family:Courier New;">     <script type="text/javascript">
<span style="white-space:pre">	</span>$(document).ready(function(){
 <span style="white-space:pre">	</span>  $("input").focus(function(){  //获得焦点
    <span style="white-space:pre">	</span>    $("input").css("background-color","#FFFFCC");
  <span style="white-space:pre">	</span>  });
  <span style="white-space:pre">	</span>  $("input").blur(function(){
  <span style="white-space:pre">	</span>    $("input").css("background-color","#D6D6FF");
  <span style="white-space:pre">	</span>  });
<span style="white-space:pre">	</span>});
    </script></span>

<span style="font-family:Courier New;">    <body>
      Enter your name: <input type="text" />
      <p>请在上面的输入域中点击，使其获得焦点，然后在输入域外面点击，使其失去焦点。</p>
    </body></span>


3、change()当元素的值发生改变时，会发生 change 事件。 该事件仅适用于文本域（text field），以及

   textarea 和 select 元素。change() 函数触发 change 事件，或规定当发生 change 事件时运行的函数。

   注释：当用于 select 元素时，change 事件会在选择某个选项时发生。当用于 text field 或 text area 时，该事    件会在元素失去焦点时发生。

   语法：$(selector).change(function)

<span style="font-family:Courier New;">   <script type="text/javascript">
      $(document).ready(function(){
        $(".field").change(function(){
          $(this).css("background-color","#FFFFCC");
        });
        $("button").click(function(){
          $("input").change();
        });
      });
   </script></span>
<span style="font-family:Courier New;">   <body>
     <button>激活文本域的 change 事件</button>
     <p>Enter your name: <input class="field" type="text" /></p>
   </body></span>


4、click()当点击元素时，会发生 click 事件。当鼠标指针停留在元素上方，然后按下并松开鼠标左键时，就会发生一次      click。click() 方法触发 click 事件，或规定当发生 click 事件时运行的函数。

   语法：$(selector).click(function) 

<span style="font-family:Courier New;">   <script type="text/javascript">
     $(document).ready(function(){
       $("button").click(function(){
        $("p").slideToggle();
       });
     });
   </script></span>
<span style="font-family:Courier New;">   <body>
    <p>这是一个段落。</p>
    <button>切换</button>
   </body></span>

5、dblclick()当双击元素时，会发生 dblclick 事件。当鼠标指针停留在元素上方，然后按下并松开鼠标左键时，就会发生

   一次 click。在很短的时间内发生两次 click，即是一次 double click 事件。dblclick()方法触发 dblclick 

   事件，或规定当发生 dblclick 事件时运行的函数。提示：如果把 dblclick 和 click 事件应用于同一元素，

   可能会产生问题。

   语法：$(selector).dblclick(function) 

<span style="font-family:Courier New;">   <script type="text/javascript">
      $(document).ready(function(){
        $("button").dblclick(function(){
          $("p").slideToggle();
        });
      });
   </script></span>
<span style="font-family:Courier New;">   <body>
     <p>这是一个段落。</p>
     <button>请双击此处</button>
   </body></span>

6、

7、

8、

9、










testguess
关注
专栏目录
Serverless中的事件驱动架构设计与实现
程序员光剑
07-23 1429
随着近几年云计算、微服务、容器技术等技术的发展，越来越多的人开始转向云原生开发模式。Serverless架构也逐渐成为各大公司推崇的一种新型应用架构。其独特之处在于通过事件驱动方式处理数据流，具有高效、弹性、易扩展、按需付费等优点。本文将以亚马逊的Serverless架构为例，结合实际案例讲述如何实现一个事件驱动的Serverless架构。事件驱动架构（Event-Driven Architecture，EDA）是一种面向事件的应用架构风格，它通常是指利用事件触发执行功能或业务逻辑的方式。
java小技能：微信代金券（服务端开发）【注意事项】
iOS逆向与安全
05-05 1078
yml配置mp : # 领券小程序：营销组件读取使用。
query.java
12-27
查询的java代码实现，适用于JAVA2教程的上机报告的实现
java的query_Java-Query
weixin_39844942的博客
02-26 901
JavaQuery一.诞生时期由美国人John Resig于2006年创建二.原理基于 JavaScript，封装了许多js底层的方法。相对于JAVA对C的封装。原本处理某个业务:JS要写多行代码而jQuery只需要短短几行甚至一句话三.设计目的write less,do more。意思是少说话，多做事，用相对简洁的语句完成了许多复杂的操作四.已知作用范围1.操作DOM元素(HTML标签)2.可以...
JavaQuery
qq_42408149的博客
09-21 2458
Jquery概念 Jquery由美国人John Resigyu 2006年创建，Jquery时目前最流行的JAVAscript程序库，它是对javascript对象和函数的封装，它的设计思想是write less, do more. 常见的javascript库 jQuery与其他javascript库 1.jQuery 2,。Bootstrap 3.Zepto 4.Ext 5YU...
JavaQuery事件
C0C0D的博客
05-05 301
文献种类：专题技术总结文献； 开发工具与关键技术：DW与 JavaScript 作者： 陈良鑫 ；年级： 19 ；撰写时间： 2020 年 4 月 28 日 JavaQuery事件 开发工具与关键技术：Adobe Dreamweaver JavaScript 作者：陈良鑫 撰写时间：2020年4月28日 mouseover与mouseenter的区别：{ mouseover如果...
(20)Query - 事件处理
魚
12-13 325
jQuery 中的事件-- 加载 DOM 在页面加载完毕后, 浏览器会通过 JavaScript 为 DOM 元素添加事件. 在常规的 JavaScript 代码中, 通常使用 window.onload 方法, 在 jQuery 中使用$(document).ready() 方法. 加载 DOM 的两种方式: jQuery 的 和 window.onlaod $(document).rea...
attributeQuery.rar_AttributeQuery
09-20
在GIS（地理信息系统）开发中，地图查询...通过这个项目，开发者可以深入理解GIS查询机制，掌握C#与ArcGIS Engine的集成技巧，同时也锻炼了事件驱动编程和数据处理能力。对于GIS开发的学习者，这是一个很好的实践案例。
java_DataBaseQuery.rar_java 控件_jtable_基于Java的系统_学籍管理 java_瀛︾睄绠＄悊
09-23
- **事件处理**：JTable支持各种事件监听，如CellEditorListener、MouseListener和KeyListener，可以捕获用户与表格的交互行为。 2. **基于Java的系统开发**： - **MVC模式**：在学籍管理系统中，很可能采用了...
基于JavaSwing的学生考勤管理系统
最新发布
10-14
在Java程序中，这通常通过事件监听机制实现，当用户点击“提交”按钮时，系统会触发相关事件处理函数，对输入的数据进行验证，然后将请求发送到服务器端进行审批。文件“qingjiaxit(1).zip”可能是请假系统的源代码...
Java Web Query 连接数据库操作
01-07
Java Web Query 连接数据库操作 1.新建工程 在Java Resources中的src文件下新建一个Package 在Package下新建一个Servlet 命名 HelloServlet (勾选生成web.xml文件) 生成文件HelloServlet.java 2。。 3。。 4。。
java的query_query
weixin_39875832的博客
02-26 1507
[TOC]# 简介Query接口让你方便地对数据库及持久对象进行查询，它可以有两种表达方式：HQL语言或本地数据库的SQL语句。Query经常被用来绑定查询参数、限制查询记录数量，并最终执行查询操作。通过Query主要完成查询操作.我们通过Query可以执行hql语句.Query query=Session.createQuery(hql);下面这个可以执行sql语句SQLQUery sqlQue...
前端query事件
weixin_42008209的博客
05-15 1005
query事件 事件函数列表： blur() 元素失去焦点 focus() 元素获得焦点 change() 表单元素的值发生变化 click() 鼠标单击 dblclick() 鼠标双击 mouseover() 鼠标进入（进入子元素也触发） mouseout() 鼠标离开（离开子元素也触发） mouseenter() 鼠标进入（进入子元素不触发） mouseleave() 鼠标离开（离开子元素...
Java query 基础知识
lllllllllaaa的博客
08-14 1万+
1.Jquery基础知识 1.1基本概念： Jquery是一个js库，能够帮我们轻松实现一些原本可能比较麻烦的功能。 Jq每个版本都有两个小版本：压缩版和未压缩版，压缩版文件较小，没有排版和注释，所以不利于阅读；未压缩版有排版有注释，利于阅读。 JQ实际就是一个JS文件，加载到页面就可以直接使用了 。 script src="jquery-3.2.1.min.js"> 也可以
java中Query类的解析和具体用法
热门推荐
weixin_48027611的博客
06-30 1万+
Query是一个查询参数类，封装了查询条件，分页，排序等功能 参数介绍 Query里面封装了一系列查询参数，主要分为以下几类： 分页参数：设置分页 排序参数：设置排序字段 条件参数：设置查询条件 字段参数：可返回指定字段 下面逐个讲解每个参数的用法。 分页参数 一般来说分页的使用比较简单，通常是两个参数， pageIndex：当前页索引，pageSize：每页几条数据。 Query类使用page(pageIdnex, pageSize)方法来设置。 假如我们要查询第二页，每页10条数据，代码可以这样写：
javaquery中的$().xxx(““)
crus_Slh的博客
07-05 143
javaquery中的$().xxx(&quot;&quot;) jQuery是一个快速，小巧，功能丰富的JavaScript库。它通过易于使用的API在大量浏览器中运行，使得HTML文档遍历和操作，事件处理，动画和Ajax更加简单。通过多功能性和可扩展性的结合，jQuery改变了数百万人编写JavaScript的方式。 $(&quot;&quot;).css(&quot;&quot;) $(&quot;&quot;).find(&amp
Java学习笔记（38）-----------Query集合
huohu1007的博客
01-18 713
Query集合用于模拟队列这种数据结构，队列通常是指“先进先出”（FIFO）的容器。 队列的头部保存队列的尾部，访问元素（poll）操作会返回队列头部的元素。通常，队列不允许随机访问队列的元素。   Query接口定义的几个方法：   void add（Object e）：将制定的元素加入到此队列的尾部. Object element（）： 获得对猎头部的元素，
java query接口_超轻量级 Java 持久化工具 Memory
weixin_31852627的博客
12-06 280
1. 概述1.1 连接、语句和结果集从JDBC的规范上看，其对数据访问层有相当简洁的抽象：1、连接(connection) 2、语句(statement)、3结果集(result set)。我们对数据库做的事情无非：连接数据库，执行语句，拿到结果。因此，持久化的工具的目的就不言自明了：进一步简化连接的管理、语句的执行、结果集提取等操作。下面从获取结果集、管理连接、语句预处理等3方面逐一阐述工具做了...
javaQuery的总结
qq_33243148的博客
02-13 832
1.向元素写入内容：$().html(val); 2.jq和js的转换：$("")[0]  $(dom对象); 3.jq的基本选择器：$("#id,name");并集，层级选择器：$("body p");子孙后代   $("body&gt;p"),儿子，$(prev+next);下一个兄弟元素，$(prev~silibing);所有同辈元素 4.JQ设置属性：$().prop(key,val...
JavaScript与BjQuery事件处理深度解析
"精通JavaScript和BjQuery，作者深入解析JavaScript事件处理机制，包括事件流、事件监听、事件类型以及浏览器兼容性问题。本书特别关注冒泡型事件，这是JavaScript事件模型的主要部分，尤其是在IE浏览器中广泛支持的...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值