帮忙解释上里面的这段 jQuery代码($.each()里面添加事件)-JavaSript-爱易网页

帮忙解释上里面的这段 jQuery代码($.each()里面添加事件)

日期：2014-05-16　浏览次数：20562 次

帮忙解释下里面的这段 jQuery代码($.each()里面添加事件)

JScript code


var images = ["1", "2", "3", "4"];
$(function(){
    $.each(images, function (i) {
        var divNew = $('<div style="width:20px;height:10px; background-color:blue;float:left;margin:2px"></div>');

        $(divNew).click(function () {
           alert(images[i]);
        });
    });
});

我想知道，点击每个新建的层为什么可以得到不同的 images[i]

------解决方案--------------------
$.each()这个方法会遍历。。和for循环差不多
------解决方案--------------------
jQuery.each( collection, callback(indexInArray, valueOfElement) )

each()方法回调函数中的第一个值是数组结构的索引。
------解决方案--------------------
这个i其实是each()方法的一个返回值，绑定事件时相当于alert(images[0])、alert(image[1])。。。
------解决方案--------------------
$.each(index, key)

index是指当前元素位于array中的索引
key是指当前元素

each就相当于封装的for语句

参考下

HTML code


<!DOCTYPE HTML>
<html>
    <head>
        <meta charset="gb2312" />
        <title></title>
    </head>
    <body>
        <div>1</div>
        <div>2</div>
        <div>3</div>
        <div>4</div>
        <script>
            function $(el){
                return typeof el == 'string' ? document.getElementById(el) : el;
            }
            function $t(name, cot){
                cot = cot || document;
                return cot.getElementsByTagName(name);
            }
            function makeArray( obj ){
                var arr = [];
                for ( var i = 0, len = obj.length; i < len; i++ ){
                    arr.push(obj[i]);
                }
                return arr;
            }            
            Array.prototype.each = function(fn){
                for ( var i =0, len = this.length; i < len; i++ ){
                    fn.call( null, i, this[i] );        
                }
            }
            var objs = $t('div');
            var arr = makeArray(objs);
            arr.each(function(i, k){
                k.onclick = function(){
                    alert(i)
                }
            })
        </script>
    </body>
</html>

免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。

帮忙解释上里面的这段 jQuery代码($.each()里面添加事件)

相关资料更多>

推荐阅读更多>