2.VQuery事件

$函数

绑定事件

• click方法
  显示隐藏——show、hide方法
• hover方法
  • 解决函数中的this问题
  • call、apply

toggle方法

<p>鼠标移动到该段落。</p>
<button>切换 hide() 和 show()</button>
<input type="button" value="1">
<input type="button" value="2">
<script>
$('input').toggle();
</script>

• 点击计数

VQuery.prototype.toggle = function() {
        var i =0;
        var count =0;
        for (var i = 0; i < this.elements.length; i++) {
            myAddEvent(this.elements[i],'click',function(){
                alert(count++);
            })
        }
};

计数器使用同一个count的情况

VQuery.prototype.toggle = function() {
    var i = 0;
    for (var i = 0; i < this.elements.length; i++) {
        addToggle(this.elements[i]);
    };

    function addToggle(obj) {
        var count = 0;   //count挪到这个位置
        myAddEvent(obj, 'click', function() {
            alert(count++);
        });
    }
};

实现以后的效果，分别计数

• arguments的使用
  现在来实现这样的效果

$('input').toggle(function() {
            alert('a')
        },function(){
            alert('b')
        },function(){
            alert('c')
        });

下面来实现方法：

VQuery.prototype.toggle = function() {
    var i = 0;
    var _arguments = arguments;
    for (var i = 0; i < this.elements.length; i++) {
        addToggle(this.elements[i]);
    };

    function addToggle(obj) {
        var count = 0;   //count挪到这个位置
        myAddEvent(obj, 'click', function() {
            console.log(arguments)
            arguments[count%arguments.length].call(obj);
            count++;
        });
    }
};

报错：Uncaught TypeError: arguments[(count % > arguments.length)].call is not a function

查看arguments为空

arguments为空

因为这里arguments的function参数为0个。

function() {
            console.log(arguments)
            arguments[count%arguments.length].call(obj);
            count++;
        }

要调用toggle的argument，老方法，定义_arguments。最后的结果：

VQuery.prototype.toggle = function() {
    var i = 0;
    var _arguments = arguments;
    for (var i = 0; i < this.elements.length; i++) {
        addToggle(this.elements[i]);
    };

    function addToggle(obj) {
        var count = 0;   //count挪到这个位置
        myAddEvent(obj, 'click', function() {
            _arguments[count%_arguments.length].call(obj);
            count++;
        });
    }
};