绑定事件bind

2018-09-25  本文已影响0人  暴走的金坤酸奶味

click


$(function(){
            只能绑定click事件,不能绑定其他的了
             $('#btn').click(function() {
            //  /* Act on the event */
            });

bind方式可绑定多个事件
            $('#btn').bind('click mouseover', function() {
                alert('hello!');

                //取消绑定事件
                $(this).unbind('mouseover');

主动触发与自定义事件

主动触发

可使用jquery对象上的trigger方法来触发对象上绑定的事件。

自定义事件

除了系统事件外,可以通过bind方法自定义事件,然后用tiggle方法触发这些事件。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>自定义事件</title>
    <style type="text/css">
        
    </style>
    <script type="text/javascript" src="js/jquery-1.12.4.min.js"></script>
    <script type="text/javascript">
        $(function(){
            //自定义事件只能用bind方式绑定,第一个参数是事件的名字,第二个参数是事件发生时执行的函数
            $('#btn1').bind('hello', function(){
                alert('hello');
            })
            $('#btn1').bind('click', function(){
                alert('click');
            })
            $('#btn2').click(function() {
                // trigger即可以触发自定义事件,也可以触发原始的事件
                $('#btn1').trigger('hello');
                $('#btn1').trigger('click');
            });
            
            //不一定点击按钮触发,也可页面加载时触发,也可在满足某种if条件时触发
            // $('#btn1').trigger('hello');
        })
    </script>
</head>
<body>
    <input type="button" value="按钮" id="btn1">
    <input type="button" value="按钮2" id="btn2">
</body>
</html>
上一篇 下一篇

猜你喜欢

热点阅读