第77天:jQuery事件绑定触发
一、元素操作
1、 高度和宽度
$(“div”).height(); // 高度
$(“div”).width(); // 宽度
.height()方法和.css(“height”)的区别:
返回值不同,.height()方法返回的是 数字类型(20),.css(“height”)返回的是字符串类型(20px),因此.height()方法常用在参与数学计算的时候
2、坐标值
$(“div”).offset(); // 获取或设置坐标值 设置值后变成相对定位
$(“div”).position(); // 获取坐标值 子绝父相 只能读取不能设置
3、滚动条(滚动事件)
$(“div”).scrollTop(); // 相对于滚动条顶部的偏移
$(“div”).scrolllLeft(); // 相对于滚动条左部的偏移
案例:两次跟随的广告
案例:防腾讯固定导航栏
二、jQuery事件
1、绑定
click/mouseenter/blur/keyup
// 绑定事件
bind:$node.bind(“click”,function(){});
// 触发一次
one : $node.one(“click”,function(){});
delegate : $node.delegate(“p”,”click”,function(){});
on: $node.on(“click”,”p”,function(){});
2、 解绑
unbind、undelegate
off
3、触发
click : $(“div”).click();
trigger:触发事件,并且触发浏览器默认行为
triggerHandler:不触发浏览器默认行为
第77天:jQuery事件绑定触发的更多相关文章
- 深入学习jQuery事件绑定
× 目录 [1]bind [2]trigger [3]delegate[4]on[5]one 前面的话 javascript有HTML.DOM0级.DOM2级和IE这四种事件处理程序,而jQuery对 ...
- jQuery事件绑定、解绑、命名空间
jQuery事件绑定.解绑.命名空间 <%@ page language="java" import="java.util.*" pageEncoding ...
- jQuery事件绑定和委托实例
本文实例讲述了jQuery事件绑定和委托.分享给大家供大家参考.具体方法如下: jQuery事件的绑定和委托可以用多种方法实现,on() . bind() . live() . delegate ...
- jQuery 事件绑定 和 JavaScript 原生事件绑定
总结一下:jQuery 事件绑定 和 JavaScript 原生事件绑定 及 区别 jQuery 事件绑定 jQuery 中提供了四种事件监听绑定方式,分别是 bind.live.delegate.o ...
- JQuery事件绑定,bind与on区别
jquery事件绑定bind:向匹配元素添加一个或多个事件处理器 $(selector).bind("click",data,function); live:向当前或未来的匹配元素 ...
- jQuery事件绑定,解绑,触发
事件绑定 1.bind(type,[data],fn) --type: 含有一个或多个事件类型的字符串,由空格分隔多个事件.比如"click"或"submit" ...
- jquery 事件的触发与绑定
bind事件绑定: live事件绑定: hover事件绑定: one事件绑定 toggle事件绑定:
- jQuery事件绑定.on()简要概述及应用
原文地址:http://www.jquerycn.cn/a_5346 前几天看到事件委托的时候,关于live()方法讲的不是很详细,就去搜了一下关于live()和delegate()的,最后看 ...
- jQuery事件绑定和委托
可以用多种方法实现,on() . bind() . live() . delegate() ,还有one(). 有时我们可能会像下面这样绑定一个事件: $("#div1"). ...
随机推荐
- 《阿里巴巴Java开发手册》代码格式部分应用——idea中checkstyle的使用教程
<阿里巴巴Java开发手册>代码格式部分应用--idea中checkstyle的使用教程 1.<阿里巴巴Java开发手册> 这是阿里巴巴工程师送给各位软件工程师的宝典,就像开车 ...
- 20155301 《Java程序设计》实验五网络编程与安全
20155301 <Java程序设计>实验五网络编程与安全 实验内容 实验1: 两人一组结对编程:参考http://www.cnblogs.com/rocedu/p/6766748.htm ...
- aspnetcore 2.1 发布到树莓派3linux的艰辛路程
发布至docker for windows. 提示: image operating system "windows" cannot be used on this platfor ...
- OpenStack入门篇(四)之KVM虚拟机介绍和管理
1.查看虚拟机,启动虚拟机 [root@linux-node1 ~]# virsh list --all Id Name State --------------------------------- ...
- Linux 的字符串截取
假设有变量 var=http://www.aaa.com/123.htm 1. # 号截取,删除左边字符,保留右边字符. echo ${var#*//} 其中 var 是变量名,# 号是运算符,*// ...
- javaweb总结(四十)——编写自己的JDBC框架
一.元数据介绍 元数据指的是"数据库"."表"."列"的定义信息. 1.1.DataBaseMetaData元数据 Connection.g ...
- Visual Studio 设置C#语言代码格式
设置代码大括号不另起一行: 工具 -> 选项 -> 文本编辑器 -> C# -> 代码样式 -> 格式设置
- MySQL5.6.14从安装到启动全过程
1.下载 地址:http://dev.mysql.com/downloads/mysql/ 这里选择的是Linux-Generic平台,下载了MySQL-5.6.14-1.linux_glibc2.5 ...
- TPO-18 C2 Possible participation in a sociology project
TPO-18 C2 Possible participation in a sociology project 第 1 段 1.listen to a conversation between a s ...
- vue中的样式
一.使用class样式: CSS部分: <style> .green{ color:green; } .italic{ font-style:italic; } .thin{ ; } .a ...