jQuery基础之事件
jQuery基础之事件方法,如下图:

代码实现:
<script src="JS/jquery-1.12.4.min.js"></script>
<script>
$(function(){
var $btn = $('#btn1');
// 鼠标点击事件
$btn.click(function(){
alert('使用JS实现鼠标单击事件!');
});
// 元素获取焦点事件
var $txt = $('#txt1');
$txt.focus(function(){
$txt.val('获取到焦点。')
});
// 元素失去焦点事件
$txt.blur(function(){
$txt.val('元素失去焦点。')
});
// 鼠标进入范围mouseover()事件
var $div = $('.div1');
$div.mouseover(function(){
// this表示当前对象
$(this).css({
'width':'200px',
'height':'200px',
'background':'red'
});
});
// 鼠标离开范围mouseout()事件
$div.mouseout(function(){
$(this).css({
'width':'100px',
'height':'100px',
'background':'blue'
});
});
});
// ready()DOM加载完成后执行的事件
$(document).ready(function(){
alert('这是DOM加载完成后执行的事件!')
});
</script> <body> <input type="button" value="事件按钮" id="btn1">
<hr>
<input type="text" id="txt1">
<div class="div1">
这是事件的范围
</div>
</body>
jQuery基础之事件的更多相关文章
- Jquery基础之事件操作
事件是用户操作时页面或页面加载时引发的用来完成javascript和HTML之间的交互操作.常见的元素点击事件.鼠标事件.键盘输入事件等,较传Javascript 相比JQuery增加并扩展了基本的事 ...
- 【总结整理】JQuery基础学习---事件篇
jQuery鼠标事件之click与dbclick事件 用交互操作中,最简单直接的操作就是点击操作.jQuery提供了两个方法一个是click方法用于监听用户单击操作,另一个方法是dbclick方法用于 ...
- jQuery基础笔记 事件(6)
day56 参考:https://www.cnblogs.com/liwenzhou/p/8178806.html#autoid-1-9-6 事件 ***** 1. 目前为止学过的绑定 ...
- JQuery基础与事件和动画
JQuery语法 1.JQuery("选择器").action; 通过选择器调用时间函数 但Jquery可以用$符号代替,即$("选择器").action; ① ...
- 【jQuery基础学习】03 jQuery中的事件与动画
关于jQuery中的事件 js与HTML之间的交互是通过用户和浏览器操作页面时引发的事件来处理的. jQuery增加并扩展了基本的事件处理机制,jQuery不仅提供了更加优雅的事件处理方法,而且极大地 ...
- JQuery基础教程:事件(上)
在页面加载后执行任务 之前我们已经知道了$(document).ready()是jQuery基于页面加载执行任务的一种主要方式,但是要知道原生的window.onload事件也可以实现相同的 ...
- jQuery基础(三)事件
1.鼠标事件 jQuery鼠标事件之click与dblclick事件 click方法用于监听用户单击操作,dbclick方法用于监听用户双击操作. 方法一:$ele.click() 绑定$ele元素, ...
- jQuery基础(4)- 位置信息、事件流、事件对象、事件代理、jquery事件
一.jQuery的位置信息 jQuery的位置信是JS的client系列.offset系列.scroll系列封装好的一些简便api. 1.宽度和高度 a.获取宽度和高度,例如: .width() // ...
- jQuery基础(鼠标事件,表单事件,键盘事件,自定义事件 篇)
1.jQuery鼠标事件之click与dbclick事件 方法一:$ele.click()(不带参数) <div id="test">点击触发<div&g ...
随机推荐
- 如何利用缓存机制实现JAVA类反射性能提升30倍
一次性能提高30倍的JAVA类反射性能优化实践 文章来源:宜信技术学院 & 宜信支付结算团队技术分享第4期-支付结算部支付研发团队高级工程师陶红<JAVA类反射技术&优化> ...
- c++中while(cin>>str)和ctrl z的相关问题探讨
对于while (cin>>str)和ctrl z的问题,网上有以下解释: -------------------------------------------------------- ...
- python——函数的形参和实参、参数
python的参数分类 python参数可以分为两类:1.定义时的参数--形参(形式参数).2.调用时的参数--实参(实际参数,传参) 实参的规则 实参就是在函数调用的时候,通过函数后面的括号传递给函 ...
- 2019年10月11号 王庆超 linux
1.计算机操作系统简介 (1)掌握操作系统的定义:操作系统是一个用来协调.管理和控制计算机硬件和软件资源的系统 程序,它位于硬件和应用程序之间. (2)掌握操作系统的内核的定义:操作系统的内核是一个管 ...
- mysql找出重复数据的方法
mysql找出重复数据的方法<pre>select openid,count(openid) from info group by openid,jichushezhi_id HAVING ...
- 『嗨威说』算法设计与分析 - PTA 程序存储问题 / 删数问题 / 最优合并问题(第四章上机实践报告)
本文索引目录: 一.PTA实验报告题1 : 程序存储问题 1.1 实践题目 1.2 问题描述 1.3 算法描述 1.4 算法时间及空间复杂度分析 二.PTA实验报告题2 : 删数问题 2.1 实践题目 ...
- tomcat的catalina.out日志切割
目前我们的日志文件catalina.out累积后非常大,部分应用的catalina.out达到几十G并且还在持续增长. 日志文件太大不便于阅读和排查问题.业务增长不断增长,日志也在不断增加,为了以后便 ...
- 在linux (centos)上使用puppeteer实现网页截图
1.安装nodejs和npm # 下载解压 wget -c https://nodejs.org/dist/v8.9.1/node-v8.9.1-linux-x64.tar.xz tar -xvf n ...
- 创建sql自定义的函数及商品分页sql存储过程
--商品筛选时判断品牌ID是否存在 --select dbo.isValite(94,94)create function isValite(@brandId int,@bId int)returns ...
- systemd概念和运行机制
systemd概念 核心概念:单元 依赖关系 systemd事务 启动目标和运行级别 单元 早期CentOS版本中的服务管理脚本在CentOS7中被服务但源文件替换.系统初始化需要启动后台服务,需要完 ...