jquery 调用 click 事件的三种方式

最新推荐文章于 2022-04-20 11:12:40 发布

weixin_34336526

最新推荐文章于 2022-04-20 11:12:40 发布

阅读量126

点赞数

文章标签： xhtml javascript python ViewUI

原文链接：https://my.oschina.net/yongqingfan/blog/618832

版权

2019独角兽企业重金招聘Python工程师标准>>>

第一种方式：

$(document).ready(function(){  
  $("#clickme").click(function(){  
       alert("Hello World  click");  
  });

第二种方式：

$('#clickmebind').bind("click", function(){  
 alert("Hello World  bind");  
});

第三种方式：

$('#clickmeon').on('click', function(){  
 alert("Hello World  on");  
});  
});

注意：第三种方式只适用于jquery 1.7以上的版本

源码如下：

<span style="color:#333333;"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />  
  
<script type="text/javascript" src="js/jquery-1.6.1.min.js"></script>  
<script type="text/javascript" src="js/jquery.validate.js"></script>  
<script type="text/javascript" src="js/jquery.metadata.js"></script>  
<script type="text/javascript" src="js/messages_zh.js"></script>  
<style type="text/css">  
    #frm label.error {  
        color: Red;  
    }  
</style>  
</head>  
<script type="text/javascript">  
  
$(document).ready(function(){  
  $("#clickme").click(function(){  
       alert("Hello World  click");  
  });  
    
    
 $('#clickmebind').bind("click", function(){  
  alert("Hello World  bind");  
 });  
  
$('#clickmeon').on('click', function(){  
 alert("Hello World  on");  
});  
});  
  
</script>  
<body>  
<label></label>  
<form id="frm" name="frm" method="post" action=""><label>用 户 名:  
    <input type="text" name="username" id="username" />  
</label>  
  <p>  
    <label>邮       编 :<label></label></label>  
    <label>  
    <input type="text" name="postcode" id="postcode" />  
    <br />  
    </label>  
  </p>  
  <p><label>数      字 :   
    <input type="text" name="number" id="number" />  
  </label>  
    <br /><label>身份证号：  
    <input type="text" name="identifier" id="identifier" />  
    </label>  
       
  <label>  
  <input type="button" name="clickme"  id="clickme"   value="click me" />   
  </label>  
   <label>  
  <input type="button" name="clickmebind" id="clickmebind"  value="clickme_bind" />  
  </label>  
  <label>  
  <input type="button" name="clickmeon" id="clickmeon"  value="clickme_on" />  
  </label>  
  </p>  
</form>  
</body>  
</html>  
</span>

转载于:https://my.oschina.net/yongqingfan/blog/618832