2016-08-02 127 views
1

我经历了一段代码,并且这个匿名函数传递了索引和值的值作为参数。这是如何有用的,因为我们根本不是手动调用函数? (通过事件呼叫除外)。此外,该索引值(随后在函数中使用)从哪里发起?谁正在传递这个价值观,他们从哪里来?该函数如何获取索引值?

var hideCode = function houdini() 
{ 
    var numRand = getRandom(4); 
    $(".guess_box").each(function(index, value) 
    { 
     if(numRand == index) 
     { 
      $(this).append("<span id='has_discount'></span>"); 
      return false; 
     } 
    }); 
} 
+2

http://api.jquery.com/jquery.each/ –

+2

'index'是'.guess_box'元件的第n个一次出现。这是经过DOM操作后每个jQuery的序列化。如果我们在DOM中有3个类为'.guess_box'的元素,那么每个方法都会循环索引1,2,3 ...... – dinesh

+0

@JaromandaX我已经从头第一个Javascript中知道了JavaScript的基础知识,但还没有看到一个匿名函数被传递一个值之前。这就是我困惑的原因。根据提供的答案,每个()是一个jQuery函数,而不是一个JavaScript的,因此我对此的困惑是合理的。 –

回答

2

jQuery's docs

的。每个()方法被设计成使DOM循环结构简洁 和不易出错。当它被调用时,它遍历作为jQuery对象一部分的DOM元素 。每次回调运行时,都是 通过当前循环迭代,从0开始。更重要的是, 回调是在当前DOM元素的上下文中触发的,所以 这个关键字this引用了元素。

这意味着是$('.guess_box')被称为它之后,.each(...)迭代返回的阵列上从0开始直到长度-1。这与在返回的数组上调用for循环非常相似。

下面的代码片段展示了使用jQuery的.each()函数进行迭代的结果,与使用纯Javascript和for循环的类似迭代相比较。

var showCode = function houdini() { 
 
    // Prints the results of each iteration so you can see what happens. 
 
    $(".guess_box").each(function(index, value) { 
 
    console.log($(this).text()); 
 
    }); 
 
    // In pure JS you would do something like this, which is very similar. 
 
    var boxes = document.getElementsByClassName('guess_box'); 
 
    for (var i = 0; i < boxes.length; i++) 
 
    console.log(boxes.item(i)); 
 
} 
 
$('#tester').click(function() { 
 
    showCode(); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="guess_box">test 1</div> 
 
<div class="guess_box">test 2</div> 
 
<div class="guess_box">test 3</div> 
 
<div class="guess_box">test 4</div> 
 
<button id="tester">click me</button>

4

当写:

$(".guess_box").each(function(index, value) 
    { $(".guess_box").each(function(index, value) 
     { 
      //do something 
     } 

通过在各功能拍下的索引参数是与指数0开始长度的迭代器 - 由jQuery选择所选择的项目的1。

参见 - http://api.jquery.com/jquery.each/