var $question = $(".question");
$question.bind("click",function(){
var $nextele = $(this).next();//定义局部变量
if($nextele.is(":hidden")){//判断回答的元素是否可见
$nextele.show();
$question.html("good for you");
$question.css("color","red")
}else{
$nextele.hide();
$question.html("Do you konw about jquery");
$question.css("color","black")
}
})
$question.mouseover(function(){
$(this).next().show();
}).mouseout(function(){
$(this).next().hide();
})
// 合成事件 hover（）
$question.hover(function(){
$(this).next().show();
},function(){
$(this).next().hide();
}
)
})
$("element").bind("click",function(even){//event:事件对象
})
当你点击element元素的时候，点击事件就被创建了，这个事件对象只有事件处理函数才能访问的到，事件处理函数执行完毕后，事件对象就会被销毁。$("element").bind("click",function(even){//event:事件对象
event.stopPropagation()//停止事件冒泡
})
这样在element元素的事件被触发的时候，就不会影响到其他元素的事件了。var $btn = $("#password");
$btn.bind("click",function(event){
var $user = $("#userName").val();//输入框对象
if($user==""){//判定它的值是不是为空
event.preventDefault();//阻止默认行为
}
})
如果想同时对事件对象停止冒泡和默认行为，可以在事件处理函数中返回false，这是对在事件对象上同时调用stopprapagation（）方法和preventDefault（）方法的一种简写var $btn = $("#password");
$btn.bind("click",function(event){
var $user = $("#userName").val();//输入框对象
if($user==""){//判定它的值是不是为空
return false;
}事件捕获：
})
$btn.bind("click",function(event){
console.info(event.type);
})2：event.preventDefault（）方法
$btn.bind("click",function(event){
console.info(event.target);
})
// 多个元素绑定同一个事件：移除按钮元素上以前注册的事件：
$(".addbtn").bind("click",function(evetn){
$(".add-text").append("<b>我是一号</b>");
}).bind("click",function(event){
$(".add-text").append("<b>我是二号</b>");
}).bind("click",function(evetn){
$(".add-text").append("<b>我是三号</b>");
})
// 多个元素绑定同一个事件：
$(".addbtn").bind("click",fun1=function(evetn){
$(".add-text").append("<p>我是一号</p>");
}).bind("click",fun2=function(event){
$(".add-text").append("<p>我是二号</p>");
}).bind("click",fun3=function(evetn){
$(".add-text").append("<p>我是三号</p>");
})
$(".removebtn").bind("click",function(event){
$(".addbtn").unbind("click",fun2)//移除按钮的第二个事件
})
// 基本逻辑：1创建jquery对象，给对象设置点击事件，当用户点击元素的时候，元素开始运动。按照顺序执行：
$(function(){
$ball = $(".one");
$ball.bind("click",function(event){
$(this).animate({left:"50em",width:"20em",height:"20em",color:"red"},3000);
return false;//阻止事件冒泡和默认行为
})
})
$(function(){
$ball = $(".one");
$ball.bind("click",function(event){
$(this).animate({left:"50em",width:"20em",height:"20em",color:"red"},3000)
.animate({top:"10em",opacity:"0.7"},3000)
.animate({left:"0",width:"10em",height:"10em"},3000)
.animate({top:"0",opacity:"1"},3000)
return false;//阻止事件冒泡和默认行为
})
})
综合动画：
$(function(){
$ball = $(".one");
$ball.bind("click",function(event){
$(this).animate({left:"50em",width:"20em",height:"20em",color:"red"},3000)
.animate({top:"10em",opacity:"0.7"},3000)
.animate({left:"0",width:"10em",height:"10em"},3000)
.animate({top:"0",opacity:"1"},3000)
.fadeOut("slow");//0.6s
return false;//阻止事件冒泡和默认行为
})
})
动画回调函数：$(function(){
$ball = $(".one");
$ball.bind("click",function(event){
$(this).animate({left:"50em",width:"20em",height:"20em",color:"red"},3000)
.animate({top:"10em",opacity:"0.7"},3000)
.animate({left:"0",width:"10em",height:"10em"},3000)
.animate({top:"0",opacity:"1"},3000,function(){
$(this).css("border","5px solid black")
})
// .fadeOut("slow");//0.6s
return false;//阻止事件冒泡和默认行为
})
})
css本来是不会加入到动画队列的，一定会最先执行，但是你已经开始了动画效果，那么就需要你使用回调函数了，可以想象成一个指针，当动画结束的时候，立刻就能回调，原文：http://www.cnblogs.com/gavinzzh-firstday/p/5444870.html