JQuery调用绑定click事件的3种写法
第一种方式:
$(document).ready(function(){ $("#clickme").click(function(){ alert("HelloWorldclick"); });
第二种方式:
$('#clickmebind').bind("click",function(){ alert("HelloWorldbind"); });
第三种方式:
$('#clickmeon').on('click',function(){ alert("HelloWorldon"); }); });
注意:第三种方式只适用于jquery1.7以上的版本
源码如下:
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <htmlxmlns="http://www.w3.org/1999/xhtml"> <head> <metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/> <scripttype="text/javascript"src="js/jquery-1.6.1.min.js"></script> <scripttype="text/javascript"src="js/jquery.validate.js"></script> <scripttype="text/javascript"src="js/jquery.metadata.js"></script> <scripttype="text/javascript"src="js/messages_zh.js"></script> <styletype="text/css"> #frmlabel.error{ color:Red; } </style> </head> <scripttype="text/javascript"> $(document).ready(function(){ $("#clickme").click(function(){ alert("HelloWorldclick"); }); $('#clickmebind').bind("click",function(){ alert("HelloWorldbind"); }); $('#clickmeon').on('click',function(){ alert("HelloWorldon"); }); }); </script> <body> <label></label> <formid="frm"name="frm"method="post"action=""><label>用户名: <inputtype="text"name="username"id="username"/> </label> <p> <label>邮编:<label></label></label> <label> <inputtype="text"name="postcode"id="postcode"/> <br/> </label> </p> <p><label>数字: <inputtype="text"name="number"id="number"/> </label> <br/><label>身份证号: <inputtype="text"name="identifier"id="identifier"/> </label> <label> <inputtype="button"name="clickme"id="clickme"value="clickme"/> </label> <label> <inputtype="button"name="clickmebind"id="clickmebind"value="clickme_bind"/> </label> <label> <inputtype="button"name="clickmeon"id="clickmeon"value="clickme_on"/> </label> </p> </form> </body> </html>