我正在尝试在循环时组合字符串
[英]I am trying to combine a string while looping
问题描述
The result I am trying to get if the first two boxes are checked would be 1 2, if 3 boxes are checked the result would be 1 2 3. The x comes out as undefined. 
如果尝试选中前两个框，我尝试获取的结果将是12。如果选中了3个框，则结果将是1 23。x出现为未定义。 I assume this has to do with variable scope but even if I view the x within the input function it only shows 1 selection at a time, it is not combing them. 我认为这与变量作用域有关，但是即使我在输入函数中查看x，它一次只显示1个选择，也不会合并它们。
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script>
function MLSNumbersSelected()
{
$("input:checkbox").each(function(){
var $this = $(this);
if($this.is(":checked")){
var x = x+" "+$this.attr("id");
}
});
alert(x); //should equal what is checked for example 1 or 1 2.
}
</script>
</head>
<body>
<p id="checkBoxes">
<input type="checkbox" class="checkBoxClass" id="1" />1<br/>
<input type="checkbox" class="checkBoxClass" id="2" />2<br/>
<input type="checkbox" class="checkBoxClass" id="3" />3</p>
<p>
Check off some options then click button.
<input type="button" name="button" id="button" value="Click to Test" onClick="MLSNumbersSelected()">
</p>
</body>
5 个解决方案
解决方案1
4 已采纳 2015-05-20 23:16:54
You are defining x everytime in your loop, instead define x once and keep appending to it through the loop. 您每次在循环中都定义x，而是定义一次x，并在循环中附加到该x。 Eg: 例如：
<script>
function MLSNumbersSelected()
{
var x;
$("input:checkbox").each(function(){
var $this = $(this);
if($this.is(":checked")){
x += " "+$this.attr("id");
}
});
alert(x); //should equal what is checked for example 1 or 1 2.
}
</script>
解决方案2
1 2015-05-20 23:15:47
You have to declare x outside the .each() loop. 您必须在.each()循环外声明x。 As it is now, it is declared inside the .each() loop and then it goes out of scope before the next callback is called so you can't accumulate it's value from one callback to the next: 现在，它在.each()循环内声明，然后在调用下一个回调之前超出范围，因此您无法从一个回调到下一个回调累积它的值：
function MLSNumbersSelected() {
var x = "";
$("input:checkbox").each(function(){
if (this.checked) {
x += " " + this.id;
}
});
console.log(x);
}
FYI, I also removed the use of the jQuery from inside the loop because it's not necessary when the direct DOM properties give you everything you need already. 仅供参考，我还从循环内部删除了jQuery的用法，因为当直接DOM属性为您提供所需的一切时，就没有必要了。
You could also let the selector do the work for you, by adding :checked to the selector so it only selects checkboxes that are already checked. 您还可以通过将:checked添加到选择器中，让选择器为您完成工作，使其仅选择已选中的复选框。 And, you can then use .map() and .join() to more easily create the list: 并且，然后可以使用.map()和.join()来更轻松地创建列表：
function MLSNumbersSelected() {
var x = $("input:checkbox:checked").map(function(){
return this.id;
}).get().join(" ");
console.log(x);
}
解决方案3
1 2015-05-20 23:16:37
You re-initialize x in the loop. 您在循环中重新初始化x。 This should solve your issue: 这应该可以解决您的问题：
function MLSNumbersSelected()
{
var x = '';
$("input:checkbox").each(function(){
var $this = $(this);
if($this.is(":checked")){
x = x+" "+$this.attr("id");
}
});
alert(x);
}
解决方案4
1 2015-05-20 23:16:48
Use this to see if it achieve what you need: 使用它来查看它是否满足您的需求：
var inputs = $("input:checkbox");
inputs.each(function(i){
if(inputs.eq(i).is(":checked")){
x = x+" "+inputs.eq(i).attr("id");
}
});
解决方案5
1 2015-05-21 00:23:30
$(function() { $('#button').on('click', function() { var x = $(':checkbox:checked').map(function() { return this.id; }) .get().join(' '); alert( x ); }); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <p id="checkBoxes"> <input type="checkbox" class="checkBoxClass" id="1" />1<br/> <input type="checkbox" class="checkBoxClass" id="2" />2<br/> <input type="checkbox" class="checkBoxClass" id="3" />3</p> <p> Check off some options then click button. <input type="button" name="button" id="button" value="Click to Test"> </p>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.