JQuery調用綁定click事件的3種寫法

字號:


    這篇文章主要介紹了JQuery調用綁定click事件的3種寫法,本文簡潔清晰的給出3種寫法的代碼示例,可以很方便的復制使用,需要的朋友可以參考下
    第一種方式:
    $(document).ready(function(){
    $("#clickme").click(function(){
    alert("Hello World click");
    });
    第二種方式:
    ?
    1
    2
    3
    $('#clickmebind').bind("click", function(){
    alert("Hello World bind");
    });
    第三種方式:
    $('#clickmeon').on('click', function(){
    alert("Hello World on");
    });
    });
    注意:第三種方式只適用于jquery 1.7以上的版本
    源碼如下:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
    <html xmlns="">
    <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>數(shù) 字 :
    <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>