jquery .each函数

Question

如果我有5个带有.inputBox类的输入框，我的jquery函数会在每个.inputBox行之后添加这些标记5次。那是为什么？

我只想在每个.inputBox之后插入一次这些标签。

任何人都知道怎么做？

function addImages() {          

     $(".inputBox").each(function() {

          $('.inputBox').after("<img src=\"Images/thumbs_up_48.png\" class=\"thumbV\" id=\"up\" />");
          $('.inputBox').after("<img src=\"Images/thumbs_down_48.png\" class=\"thumbV\" id=\"down\" />");
    });
}

html

<label for="FirstName">First Name</label>
<input type="text" class="inputBox" name="FirstName" title="First Name Here" id="firstName" />

Answer 1

使用：

$(this).after("<img src=\"Images/thumbs_up_48.png\" class=\"thumbV\" id=\"up\" />");
$(this).after("<img src=\"Images/thumbs_down_48.png\" class=\"thumbV\" id=\"down\" />");

每次调用它时，

$（'。inputBox'）都会遍历整个DOM。

更好的方法是

$(".inputBox")
        .after("<img src=\"Images/thumbs_up_48.png\" class=\"thumbV\" id=\"up\" />")
        .after("<img src=\"Images/thumbs_down_48.png\" class=\"thumbV\" id=\"down\" />");

不要忘记'接受'一个适合你的答案。

Answer 2

您可以简单地丢失每个，只需使用

 $('.inputBox').after("<img src=\"Images/thumbs_up_48.png\" class=\"thumbV\" id=\"up\" />");
 $('.inputBox').after("<img src=\"Images/thumbs_down_48.png\" class=\"thumbV\" id=\"down\" />");

Answer 3

您可能不需要each，是吗？根据您的代码和patrick提出的修复程序，我认为您可以在没有each()调用的情况下使用原始代码。