jQuery操作dom事件
参考:jQuery权威指南
jQuery初步
jQuery选择器
jQuery操作dom
jQuery操作dom事件
jQuery插件
jQuery操作Ajax
jQuery动画与特效
jQuery实现导航栏
jQuery实现点击式选项卡
jQuery实现select三级联动
//1.绑定事件bind()
bind('event name', eventData, function(event) {
/* Act on the event */
});
//event name事件名称:可接收事件列表
blur,focus,load,resize,scroll,unload,click,dblclick,mounsedown,mouseup
mousemove,mouseover,mouseout,mouseenter,mouseleave,change,select,submit,keydown
keypress,keyup,error
//eventData数据对象:
//function回调函数:
//如果绑定多个事件中间用空格隔开
//映射方式绑定不同事件
$(".text").bind({
focus:function(event) {
},
change:function(){
}
});
//传参数
$(".text").bind('focus', {msg:"test"}, function(event) {
alert($(this).val());
});
//取消绑定unbind()
$("p").unbind();//取消p的所有事件
$("p").unbind( "click" );//取消p的click事件
var foo = function () {
// 处理某个事件的代码
};
$("p").bind("click", foo); // ... 当点击段落的时候会触发 foo
$("p").unbind("click", foo); // ... 再也不会被触发 foo //2.鼠标悬停事件:hover()
$(".clsTitle").hover(function() {
$(".clsContent").show();
}, function() {
$(".clsContent").hide();
});
//3.轮播事件:toggle(fn1,fn2,fn3....);该函数功能是按fn函数顺序依次执行。执行完最后一个然后再重复对这些函数轮番调用
//图片轮播:单击图片时轮播图片
//单击时变成a.jpg,再单击变成b.jpg,再次单击又变成a.jpg
$("img").toggle(function() {
$("img").attr('src', 'a.jpg');
}, function() {
$("img").attr('src', 'b.jpg');
}); //4.一次性事件:one(type,[data],fn),该事件只执行一次
//页面:<input id="btn" type="button" value="点击查看联系方式"/>
$("#btn").one('click', function(event) {
this.value="111111111111";
}); //5.自定义执行指定事件:trigger(),在页面dom元素加载完毕后自动执行某类事件,可以是自定义事件
//页面dom加载完成后,使input选中
$("input").trigger('select');
//页面dom加载完成后,给input赋默认值
$("input").bind('myEvent', function(event) {
$(this).val("默认值");
});
$("input").trigger('myEvent');
jQuery操作dom事件的更多相关文章
- jQuery学习笔记:整理一些常用的jQuery操作DOM事件
1.attr() .removeAttr() .attr() 方法可以传入一个名值对的参数,也可以传入一个包含2个以上名值对的对象参数,例如: .attr('src','images/a.jpg'); ...
- jQuery操作Dom、jQuery事件机制、jQuery补充部分
jQuery操作Dom: 修改属性: //使用attr()方法 //attr(name, value) //name:要修改的属性的属性名 //value:对应的值 //attr方法,如果当前标签有要 ...
- jQuery框架-2.jQuery操作DOM节点与jQuery.ajax方法
一.jQuery操作DOM 内部插入操作: append(content|fn):向每个匹配的元素内部追加内容. prepend(content):向每个匹配的元素内部前置内容. 外部插入操作: af ...
- 第四章 使用jQuery操作DOM
第四章 使用jQuery操作DOM 一.DOM操作 在jQuery中的DOM操作主要可分为样式操作.文本和value属性值操作.节点操作: 节点操作又包含属性操作.节点遍历和CSS-DOM操作. 其中 ...
- *jquery操作DOM总结 (原创:最全、最系统、实例展示)
jquery操作DOM包括八个方面: 一:jquery对DOM节点的基本操作:二:jquery对DOM节点的CSS样式操作:三:jquery遍历DOM节点:四:jquery创建DOM节点:五:jque ...
- Unit01: jQuery概述 、 jQuery选择器 、 jQuery操作DOM
Unit01: jQuery概述 . jQuery选择器 . jQuery操作DOM 使用jQuery放大字体: <!DOCTYPE html> <html> <head ...
- jQuery操作DOM知识总结
jquery操作DOM(节点) 1.创建元素 //$(htmlStr) //htmlStr:html格式的字符串 $("<span>这是一个span元素</span> ...
- 1、jQuery操作Dom
1.添加元素 <code> <script language="JavaScript">$().ready(function(){$("input ...
- web进阶之jQuery操作DOM元素&&MySQL记录操作&&PHP面向对象学习笔记
hi 保持学习数量和质量 1.jQuery操作DOM元素 ----使用attr()方法控制元素的属性 attr()方法的作用是设置或者返回元素的属性,其中attr(属性名)格式是获取元素属性名的值,a ...
随机推荐
- python的socket网络编程(二)
(注:本文部分内容摘自互联网,由于作者水平有限,不足之处,还望留言指正.) 国庆八天假,已过去3天了,加上明天又是中秋,还是决定在今晚把之前想写的东西写完.国庆节在宁波老家,吃好喝好睡好,就是没有好好 ...
- ViewResolver和ResponseBody笔记
处理HttpResponseBody有两种方式,ViewResolver(视图解析器)和ResponseBody ViewResolver.View多用于jsp,ViewResolver的主要作用是把 ...
- README.android
Default (and possibly architecture dependents) HAL modules go here. libhardware.so eventually should ...
- struts2中各个jar包作用 (转)
Struts2.3.4 所需的Jar包及介绍 Jar包的分类 jar包名称 jar包版本 jar包 文件名 jar包 的作用 jar包内包含的主要包路径及主要类 依赖的自有jar包名称 依赖的第三方j ...
- JS输出表格头上的文字内容
Array.from(document.querySelectorAll("#tb1 tr .cell")).map(it=>it.innerText)
- Java之JNDI详解
转载自(http://blog.csdn.net/u010430304/article/details/54601302) JNDI的基本应用 JNDI是Java Naming and ...
- 管理账号密码的工具-KeePass使用方法
附件链接:https://files.cnblogs.com/files/stxs/KeePass.zip 打开压缩包“KeePass.zip",将文件"KeePass.exe&q ...
- CentOS 7 Nginx安装配置
1.添加Nginx源 yum install epel-release 2.安装Nginx yum install nginx 3.启动Nginx systemctl start nginx //配置 ...
- 【论文解析】MTCNN论文要点翻译
目录 0.论文连接 1.前言 2.论文Abstract翻译 3.论文的主要贡献 4.4 训练 5 模型性能分析 5.1 关于在线挖掘困难样本的性能 5.2 将人脸检测与对齐联合的性能 5.3 人脸检测 ...
- 生产消费模式:多线程读写队列ConcurrentQueue
需求:现需要将多个数据源的数据导入到目标数据库,这是一个经典的生产消费应用的例子. 直接上代码,看下实现: // 初始化列队缓冲区 队列大小为100 IDataCollection<List&l ...