javascript-jquery对象的事件处理
一、页面加载
1.页面加载顺序:先加载<head></head>之间的内容,然后加载<body></body>之间的内容
直接在head之间书写jquery代码,浏览器会立即执行脚本。但是由于页面元素在body部分才出现,此时尚未加载,所以jquery操作无法应用到页面元素上
解决方法:
将代码放到$(function(){
代码代码;
})
说明:$(function(){})函数等到页面加载完毕之后执行。相当于onload事件
2.onload事件和$(document).ready()区别
1.window.onload:
bunn个同时写多个window.onload,没法简化写法
2.$(document).ready(function()):
能同时多个编写,写多个时,全部执行:
简化写法$(function(){});
二、绑定事件
1.bind()方法:
语法:bind("事件名称 事件名称",处理函数());
2.事件移除:unbind()方法:
$("p").click(function(){
$("#btn").unbind("mouseover");
})
3.事件绑定one()方法:对于只需要触发一次,随后要立即移除绑定事件的情况,可以使用更为方便的one方法。
$("p").one("click",function(){})
4.模拟触发:trigger()
$("p").trigger("click");
5.triggerHandler与trigger的区别
1.triggerHandler不会触发默认浏览器默认事件。比如:输入文本框获得焦点事件focus浏览器会自动带蓝色框。而triggerHandler不会触发浏览器默认的focus事件,只触发内置的focus事件
2.triggerHandler只触发qjuery对象集合中第一个元素的事件处理函数。
3.triggerHandler方法的返回的是事件处理函数的返回值
三、事件委派
live();die();但是被废弃
统一使用:
on();off()
四、阻止默认行为的方法:
$("a").click(function(event){
event.preventDefault();
$(this).next("span").text("阻止了a元素的默认行为");
五、阻止事件冒泡:stopPropagation()
$("a").click(function(e){
e.stopPropagation();
})
})
重要:阻止事件冒泡和默认行为的方法:在函数中书写:return false;
六、时间对象的发生位置和发生时间
$("p").mousemove(function(event){
$("p:eq(0)").text("移动鼠标相对页面的坐标"+event.pageX+","+event.pageY());//event.pageX和event.pageY鼠标相对于元素的坐标。
})
javascript-jquery对象的事件处理的更多相关文章
- JavaScript 对象、DOM对象、jquery对象的区别、转换详解
一.JavaScript 对象 JavaScript 提供多个内建对象,比如 String.Date.Array 等等. 对象只是带有属性和方法的特殊数据类型. 访问对象的属性: [javascrip ...
- javascript --- jQuery --- Deferred对象
javascript --- jQuery --- Deferred对象 javascript的函数式编程是多么引人入胜,jQuery使代码尽可能的精简,intelligent! defer - 必应 ...
- jquery对象和javascript对象相互转换
本文转载:http://jeiofw.blog.51cto.com/3319919/786506 jQuery 对象是通过 jQuery 包装DOM 对象后产生的对象.jQuery 对象是 jQuer ...
- JavaScript DOM对象和JQuery对象相互转换
1.分析源代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www ...
- javascript 第26节 jQuery对象
<html> <head> <title>jQuery</title> <!--导入jquery库--> <script type=& ...
- javascript DOM对象转jquery对象
首先,假设一种情形:要在HTML文件中为一个select对象添加一个函数,这个函数的名字叫dynamic_change(this),当select的option被改变的时候调用onchange事件来处 ...
- JQuery $ $.extend(),$.fn和$.fn.extend javaScript对象、DOM对象和jQuery对象及转换 工具方法(utility)
一.为什么jquery前面要写$ Javascript没有package的概念,而作者又希望所有jQuery相关的API都能通过一个全局性的对象来容纳. 名为jQuery的全局变量就是这样一个对象,不 ...
- 使用Javascript/jQuery将javascript对象转换为json格式数据 - 海涛的CSDN博客 - 博客频道 - CSDN.NET
body{ font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI& ...
- 【JQuery】jquery对象和javascript对象即DOM对象相互转换
jQuery 对象是通过 jQuery 包装DOM 对象后产生的对象.jQuery 对象是 jQuery 独有的,其可以使用 jQuery 里的方法,但是不能使用 DOM 的方法:例如: $(&quo ...
- jquery对象和javascript对象的console.log结果
array.push($("div").children("label")); console.log(array); 输出: 这个是jquery对象,如果在选 ...
随机推荐
- MySQL实战45讲(10--15)-笔记
11 | 怎么给字符串字段加索引? 维护一个支持邮箱登录的系统,用户表是这么定义的: mysql> create table SUser( ID bigint unsigned primary ...
- elasticsearch支持大table格式数据的搜索
一.问题源起 数据情况 TableMeta, 保存table的元数据,通过fileId关联具体的GridFS文件: id name creator fileId 1 table1 mango f1 2 ...
- Linux(二)——常用命令
一.一般指令 立刻关机:shutdown -h now 1分钟后关机:shutdown -h 1 立刻重启:shutdown -r now 立刻关机:halt 立刻重启:reboot 把内存的数据同步 ...
- Linux下cat命令的使用
1.普通用法-->查看文件内容 cat file_name 查看文件时的相关参数: 1.cat f1.txt,查看f1.txt文件的内容. 2.cat -n f1.txt,查看f1.txt文件的 ...
- mysql远程连接以及错误解决&命令行基本操作
现在大家的程序服务基本都是部署在云服务器上,今天我分享记录一下:使用mysql数据库过程中比较常见操作和遇到的问题 环境:lunix 系统(阿里云服务器,华为云服务器,腾讯云等均适用) + mysql ...
- AntDesign VUE:Model组件的Button的事件this指向undefined的问题(箭头函数)
问题 一个很简单的this指向问题引起的报错: 记录下来主要是想看看这玩意到底指向哪里: 真不戳 解决方法 ES6的箭头函数,有人理解它就是没有this指向,我个人理解是它的this指向函数体的上一级 ...
- 批量ip段/子网转换
#coding=utf-8 import re import struct from sys import argv class CIDRHelper(object): def ipFormatChk ...
- oracle table()函数
PL/SQL表---table()函数用法/* PL/SQL表---table()函数用法:利用table()函数,我们可以将PL/SQL返回的结果集代替table. oracle内存表在查询和报表的 ...
- linux下分卷压缩,合并解压的3种方法
我们上传东西的时候,由于文件过大而不能上传,或者不给上传,最明显的就是发邮件了,附件最大5M,有的10M.如果超过了就郁闷了.这个时候,如果能把压缩的东西,分割开来就比较爽了,windows下面我想大 ...
- 如何点击穿透Electron不规则窗体的透明区域
实现一个不规则窗体 这里我们实现一个圆形窗体,实现其他形状的窗体与这个方法类似. 首先,把窗口的高度(height)和宽度(width)值修改为相同的值,使窗口成为一个正方形. 其次,把窗口的透明属性 ...