代码都已经测试通过，直接打开注释即可看见效果！
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><script src="js/jquery-1.8.3.js" type="text/javascript" charset="utf-8"></script><script type="text/javascript">$(function(){//鼠标单击事件/*$("#div1").click(function(){alert('a');});*///鼠标移动上的事件/*$("#div1").mousemove(function(){$(this).css("background","yellow");});*///鼠标离开事件/*$("#div1").mouseout(function(){$(this).css("background","green");});*///鼠标指针进入时/*$("#div1").mouseenter(function(){$(this).css("background","pink");});*///鼠标指针离开时/*$("#div1").mouseleave(function(){$(this).css("background","red");});*///用户按下键盘的时间/*$("[name='pass']").keydown(function(){alert("按下了键");});*///用户释放键盘的时间/*$("[name='pass']").keyup(function(){alert("释放了键");});*///当键盘或按钮被按下时/*$("[name='pass']").keypress(function(){alert("按下了键");});*///获得焦点/*$("[name='pass']").focus(function(){alert("聚焦");});*///失去焦点/*$("[name='pass']").blur(function(){alert("失去焦点");});*///绑定单个事件/*$("#div2").bind("click",function(){alert('单击完了');})*///绑定多个事件/*$("#div2").bind({mouseover:function(){$(this).css("background","red");},mouseout:function(){$(this).css("background","yellow");}});*///移除绑定的事件/*$("#div2").unbind("mouseover");*///toggle()方法，相当于模拟鼠标多次单击事件/*$("p").toggle(function(){$(this).css("background","red")},function(){$(this).css("background","orange")},function(){$(this).css("background","yellow")},function(){$(this).css("background","green")},function(){$(this).css("background","cyan")},function(){$(this).css("background","blue")},function(){$(this).css("background","people")});*///动画，jquery显示和隐藏/*$("p").hide();$("#div2").click(function(){$("p").show("300");});*///隐藏/*$("#div2").click(function(){$("p").hide("300");});*///改变元素的透明度(淡入和淡出)//淡入/*$("p").hide();$("#div2").click(function(){$("p").fadeIn("slow");})*///淡出/*$("#div2").click(function(){$("#div1").fadeOut("slow");})*///改变元素的高度/*$("#div2").click(function(){$("#div1").slideUp("slow");})*//*$("#div1").hide("3000");$("#div2").click(function(){$("#div1").slideDown("slow");})*/})</script><style type="text/css">#div1{width: 200px;height: 150px;background: pink;border-radius: 5px;line-height: 50px;text-align: center;cursor: pointer;}#div2{width: 200px;height: 150px;background: blueviolet;border-radius: 5px;line-height: 50px;text-align: center;cursor: pointer;}</style></head><body><div id="div1">按钮1<p style="background: brown;">p1</p></div><div id="div2">按钮2</div>密码<input type="password" name="pass" /></body>
</html>
)
)
)
)