Question

我进入Jquery非常快，我有trobule.I我试图获取所有输入值并提醒他们。但我只得到第一次输入。我也需要放入span，因为输入应该是可拖动的。我在做什么。我希望你能回答它

<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>

Answer 1

像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());
    });
});

Here is a jsFiddle你可以尝试一下。

Answer 2

使用.each()循环浏览每个输入。像这样：

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

Answer 3

根据您之前的帖子加上这个帖子，您似乎对jQuery选择器的工作方式存在误解。

alert($("#page input").val());无法使用，因为$("#page input")会返回input元素内page元素的每个元素的集合。

您可以在此处调用一些适用于集合中每个项目的操作。例如$("div.page").css('background-color','red'); - 这将为每个div应用红色背景颜色，其类别为page，而无需单独迭代它们。

但是有些动作无法应用于集合，并且只会选择集合中的最后一个（或者第一个，我无法记住哪个）项目。例如，您要执行的操作：alert($("#page input").val());仅会提醒一个值。因为.val()必须仅应用于一个元素。不是整个系列。所以我们在整个集合中调用它，它只返回其中一个.val()。要提醒每个值，您需要遍历集合。

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

3 个答案: