jquery 使用简明教程(3)


event.pageX 事件发生时,鼠标距离网页左上角的水平距离
event.pageY 事件发生时,鼠标距离网页左上角的垂直距离
event.type 事件的类型(比如click)
event.which 按下了哪一个键
event.data 在事件对象上绑定数据,然后传入事件处理函数
event.target 事件针对的网页元素
event.preventDefault() 阻止事件的默认行为(比如点击链接,会自动打开新页面)
event.stopPropagation() 停止事件向上层元素冒泡

在事件处理函数中,可以用this关键字,返回事件针对的DOM元素:

复制代码 代码如下:


$('a').click(function(){ 
if ($(this).attr('href').match('evil')){//如果确认为有害链接 
e.preventDefault(); //阻止打开 
$(this).addClass('evil'); //加上表示有害的class 

});


有两种方法,可以自动触发一个事件。一种是直接使用事件函数,另一种是使用 .trigger()或.triggerHandler()。

复制代码 代码如下:


$('a').click();
$('a').trigger('click');


九、特殊效果
jQuery允许对象呈现某些特殊效果。

$('h1').show(); //展现一个h1标题
常用的特殊效果如下:

复制代码 代码如下:


.fadeIn() 淡入
.fadeOut() 淡出
.fadeTo() 调整透明度
.hide() 隐藏元素
.show() 显示元素
.slideDown() 向下展开
.slideUp() 向上卷起
.slideToggle() 依次展开或卷起某个元素
.toggle() 依次展示或隐藏某个元素


除了 .show()和.hide(), 所有其他特效的默认执行时间都是400ms(毫秒),但是你可以改变这个设置。

复制代码 代码如下:


$('h1').fadeIn(300); // 300毫秒内淡入 
$('h1').fadeOut('slow'); //缓慢地淡出

在特效结束后,可以指定执行某个函数。

复制代码 代码如下:


$('p').fadeOut(300, function(){$(this).remove(); });

更复杂的特效,可以用 .animate() 自定义。

复制代码 代码如下:


$('div').animate( 

left : "+=50",//不断右移 
opacity : 0.2//指定透明度 
},
300,// 持续时间 
function(){ alert('done!'); }//回调函数 
);

.stop()和.delay()用来停止或延缓特效的执行。
$.fx.off如果设置为true,则关闭所有网页特效。

您可能感兴趣的文章:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wdydzw.html