使用jquery动态构建数组

  • Z时代
  • 2024-01-10
  • 分类：问答

我在html中有4个复选框。我想如果任何复选框被选中，它的值被存储在数组中。我创建了一个功能，但它显示了空数组使用jquery动态构建数组

var arry = [];  
function CheckBox(check) {  
    debugger  
    for (i = 0; i < check.length; i++) {  
    if (check[i].checked == true) {  
     arry.push(check[i].value);  
     alert(arry);  
    }  
    }  
}  
$(document).ready(function() {  
    $("#btn").click(function() {  
    debugger;  
    alert(arry);  
    });  
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  
<div>  
    <input type="checkbox" id="chk1" value="1" class="chk" onclick="CheckBox(this)" />1  
    <input type="checkbox" id="chk2" value="2" class="chk" onclick="CheckBox(this)" />2  
    <input type="checkbox" id="chk3" value="3" class="chk" onclick="CheckBox(this)" />3  
    <input type="checkbox" id="chk4" value="4" class="chk" onclick="CheckBox(this)" />4  
    <input type="button" id="btn" value="alert" />  
</div>

回答：

  1. 您可以使用.each()循环复选框

  2. 使用.is(":checked")检查检查状态

$(document).ready(function() {  
    $("#btn").click(function() {  
    var arry = [];  
    $.each($(".chk"), function() {  
     if ($(this).is(":checked")) {  
     arry.push($(this).val());  
     }  
    })  
    console.log(arry)  
    });  
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  
<div>  
    <input type="checkbox" id="chk1" value="1" class="chk" />1  
    <input type="checkbox" id="chk2" value="2" class="chk" />2  
    <input type="checkbox" id="chk3" value="3" class="chk" />3  
    <input type="checkbox" id="chk4" value="4" class="chk" />4  
    <input type="button" id="btn" value="alert" />  
</div>

回答：

几个问题。最糟糕的是没有得到函数中的复选框。

你通过一个盒子，而不是一个盒子

var arry = [];  
function CheckBox(check) {  
    arry = [];  
    $("."+check.className).each(function() { // get the other checks  
    if (this.checked) { // or jQuery: $(this).is(":checked");  
     arry.push(this.value); // or jQuery $(this).val()  
     alert(arry);  
    }  
    })  
}  
$(document).ready(function() {  
    $("#btn").click(function() {  
    alert(arry);  
    });  
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  
<div>  
    <input type="checkbox" id="chk1" value="1" class="chk" onclick="CheckBox(this)" />1  
    <input type="checkbox" id="chk2" value="2" class="chk" onclick="CheckBox(this)" />2  
    <input type="checkbox" id="chk3" value="3" class="chk" onclick="CheckBox(this)" />3  
    <input type="checkbox" id="chk4" value="4" class="chk" onclick="CheckBox(this)" />4  
    <input type="button" id="btn" value="alert" />  
</div>

回答：

添加下面的变化，你的JavaScript/jQuery代码

$("#btn").click(function() { 
    var arry = []; 
    $.each($(".chk"), function() { 
     if ($(this).is(":checked")) { 
     arry.push($(this).val()); 
     } 
    }) 
    alert(arry) 
    }); 
});

以上是 使用jquery动态构建数组 的全部内容， 来源链接： utcz.com/qa/261522.html

回到顶部