JQuery 事件
jquery事件绑定：
- js方式：
1通过标签的事件属性进行绑定
2.获取对象
对象.事件属性 = function(){ 函数体 }
- jquery方式：
获取jquery对象
jquery对象.事件方法(function(){ 函数体 })
- jquery事件：
submit()
clcik()
focus()
blur()
change()
案例：
效果图：
代码：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>常见事件</title> <style type="text/css"> #e02 { border: 1px solid #000000; height: 200px; width: 200px; } </style> <script src="js/jquery-1.11.0.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $("#e01").blur(function() { $("#textMsg").html("文本框失去焦点：blur"); }).focus(function() { $("#textMsg").html("文本框获得焦点：focus"); }).keydown(function() { $("#textMsg").append("键盘按下：keydown"); }).keypress(function() { $("#textMsg").append("键盘按：keypress"); }).keyup(function() { $("#textMsg").append("键盘弹起：keyup"); }); var i = 0; $("#e02").mouseover(function() { $("#divMsg").html("鼠标移上：mouseover"); }).mousemove(function() { //$("#divMsg").html("鼠标移动：mousemove , " + i++ ); }).mouseout(function() { $("#divMsg").html("鼠标移出：mouseout"); }).mousedown(function() { $("#divMsg").html("鼠标按下：mousedown"); }).mouseup(function() { $("#divMsg").html("鼠标弹起：mouseup"); }); $("#e03").click(function() { $("#buttonMsg").html("单击：click"); }).dblclick(function() { $("#buttonMsg").html("双击：dblclick"); }); }); </script> </head> <body> <input id="e01" type="text" /><span id="textMsg"></span> <br/> <hr/> <div id="e02"></div><span id="divMsg"></span> <br/> <hr/> <input id="e03" type="button" value="可以点击" /><span id="buttonMsg"></span> <br/> </body> </html>
