1.事件处理
1.1.事件绑订
bind(type,fn);
例子:
. 代码如下:
$(function(){
//正式的写法
$('#d1').bind('click',function(){
$(this).css('font-size','80px');
});
//简写形式
$('#d1').click(function(){
$(this).css('font-size','80px');
});
});
. 代码如下:
click(function(){
});
. 代码如下:
$(function(){
//分开的事件
$('.s1').mouseenter(function(){
$(this).addclass('s2');
});
$('.s1').mouseleave(function(){
$(this).removeclass('s2');
});
//合成事件
$('.s1').hover(function(){
$(this).addclass('s2');
},function(){
$(this).removeclass('s2');
});
});
. 代码如下:
$(function(){
$('#a1').toggle(function(){
$('#d1').show('slow');
},function(){
$('#d1').hide('slow');
});
});
. 代码如下:
$(function(){
$('a').click(function(e){
//e:jquery对象,里面包含了一个事件对象。
//target属性返回的是一个dom对象,即事件源。
var srcobject = e.target;
alert(srcobject.innerhtml);
});
});
. 代码如下:
$(function(){
$('a').click(function(e){
alert('你点击了一个链接');
//停止冒泡
e.stoppropagation();
});
$('#d1').click(function(e){
alert('你点击了一个p');
});
});
. 代码如下:
$(function(){
$('a').click(function(e){
var flag = confirm('是否确定删除?');
if(!flag){
//停止默认行为
e.preventdefault();
}
});
});
. 代码如下:
$(function(){
$('a').click(function(e){
alert(e.type); //获得事件类型
alert(e.pagex + ' ' +e.pagey);
});
});
. 代码如下:
$(function(){
$('#b1').click(function(){
//让username对应的文本输入框获得焦点
$('#username').trigger('focus');
//另外,也可以简化
$('#username').focus();
});
});
. 代码如下:
$(function(){
$('#a1').toggle(function(){
$('#d1').show('slow');
$('#d1').slidedown('slow');
},function(){
$('#d1').hide('slow');
$('#d1').slideup('slow');
});
});
. 代码如下:
$(function(){
$('#b1').toggle(function(){
$('#d1').fadeout('slow');
},function(){
$('#d1').fadein('slow');
});
});
. 代码如下:
$(function(){
$('#d1').click(function(){
//动画队列
$(this).animate({'left':'400px'},3000);
$(this).animate({'top':'250'},2000).fadeout('slow');
});
});
. 代码如下:
$(function(){
$('#b1').click(function(){
//var $obj = $('ul li');
alert($obj.length);
$obj.each(function(i){
//i:表示正在被访问的那个dom对象的下标,
//下标从0开始。
//this:表示正在被访问的那个dom对象
if(i==0){
$(this).css('font-size','60px');
}else if(i==1){
$(this).css('font-style','italic');
}else{
$(this).css('color','red');
}
});
//var $obj = $('ul li');
var $o = $obj.eq(1);
//$o.css('font-size','60px');
var index = $obj.index($o);
//alert(index);
//var $obj = $('ul li');
var arr = $obj.get();
//alert(arr[1].innerhtml);
var $obj = $('ul li');
var obj = $obj.get(1);
alert(obj.innerhtml);
});
});
如对本文有疑问, 点击进行留言回复!!
MFC的静态库.lib、动态库.dll(包含引入库.lib)以及Unicode库示例
CTF 刷题记录(一) 白云新闻搜索(手动与自动化SQL注入)
javascript如何使用函数random来实现课堂随机点名方法详解
网友评论