JQuery常用事件

1.click
2.blur 失去焦点
3.focus 得到焦点
4.change 值发生改变
5.ready 页面加载完成 onload
$(document).ready(function(){});//完整写法
$(document(){});//简写

在事件中获取事件源的方式
1.如果元素动态绑定事件,this为事件源
2.非动态绑定 event.target||event.srcElement
3.绑定事件时传递this 事件中用变量接收,此变量就是事件源

事件模拟
//延时执行
setTimeout(function(){
//模拟按钮的点击事件
$(“input”).trigger(“click”);
},3000);

事件的合并
1.切换显示和不显示 toggle();
2.hover(fn1,fn2);相当于 onmouseover + onmouseout
//给div添加hover事件
$(“div”).hover(function(){
alert(“进来了”);
},function(){
alert(“出去了”);
});

动画

1.显示
function fn1(){//显示
$(“img”).show(3000);
}
2.隐藏
function fn2(){//隐藏
//第一个参数为动画时间,第二个参数为回调函数(可省略)
$(“img”).eq(0).hide(3000,function(){
$(“img”).show(3000);
});
}
3.上滑
function fn3(){//上滑
$(“img”).eq(1).slideUp(2000);
}
4.下滑
function fn4(){//下滑
$(“img”).eq(1).slideDown(2000);
}
5.淡入
function fn5(){//淡入
$(“img”).eq(2).fadeIn(1000);
}
6.淡出
function fn6(){//淡出
$(“img”).eq(2).fadeOut(1000);
}
7.自定义 通过修改样式(大小 位置) 以动画的形式改变样式
function fn7(){//自定义
$(“img”).animate({“left”:“250px”},2000)
.animate({“top”:“250px”},2000)
.animate({“left”:“0px”},2000)
.animate({“top”:“0px”},2000)
.animate({“width”:“300px”,“height”:“250px”},2000)
.animate({“width”:“200px”,“height”:“150px”},2000);
}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值