获取所有输入值时出现问题

问题描述

|| 我进入Jquery的速度非常快，遇到麻烦了。我试图获取所有输入值并发出警报。我会回答

<label>Paragraph</label>
<span class=\"blue\">
<div id=\"page\"></div>
</span>
<script>
$(\"label\").click(function(){
$(\"#page\").append(\'<span class=\"blue\"><input  type=\"text\" /></input></div></span>\');
$(\".blue\").draggable();
$(\"#page\").droppable();
});
$(\"#page\").dblclick(function(){
var panel= $(\"#page .blue\");
var inputs = panel.find(\"input\");
alert(inputs.val());
});
</script>

或其他样式

<p></p>
<label>Paragraph</label>
<span class=\"blue\">
<div id=\"page\"></div>
</span>
<script>
$(\"label\").click(function(){
$(\"#page\").append(\'<span class=\"blue\"><input  type=\"text\" /></input></div></span>\');
$(\".blue\").draggable();
$(\"#page\").droppable();
});
$(\"#page\").dblclick(function(){
alert($(\"#page input\").val());
});
</script>

    

解决方法

        就像Niklas所说的，您想在这里使用

each()

。这是一个基于原始代码的示例：

$(\"label\").click(function() {
    $(\"#page\").append(\'<div><input type=\"text\" value=\"foo\" class=\"fooBox\" /></div>\');
});

$(\"#page\").dblclick(function(){
    $(\'.fooBox\').each(function() {
        alert($(this).val());
    });
});

这是一个jsFiddle，您可以在其中进行尝试。     ,        使用.each（）遍历每个输入。像这样：

var inputs = panel.find(\"input\");
$(inputs).each(function(i,e){
  alert($(e).val());
});

    ,        根据您之前的文章和这篇文章，您似乎对jQuery选择器的工作方式有误解。

alert($(\"#page input\").val());

将不起作用，因为

$(\"#page input\")

会返回every8ѭ元素内每个

input

元素的集合。 您可以对此执行一些操作，这些操作将应用于集合中的每个项目。例如

$(\"div.page\").css(\'background-color\',\'red\');

-这将为带有

page

类的每个

div

应用红色背景色，而无需单独遍历它们。 但是有些操作不适用于集合，只会选择集合中的最后一个（或第一个，我不记得是哪个）项目。例如，您要尝试执行的操作：

alert($(\"#page input\").val());

只会警告一个值。因为

.val()

必须仅应用于一个元素。不是整个收藏。因此，您在整个收藏夹上都使用它，它只会为其中之一返回

.val()

。要提醒每个值，您需要遍历集合。