Question

如何使用JavaScript中的onclick将数组中的复选框值传递给函数。以下是我的HTML代码。请注意，我不使用表单标记。只使用输入标签。

 <input id="a"name="a" type="checkbox" value="1" checked="checked" >A</input>
 <input id="a"name="a" type="checkbox" value="2" checked="checked" >B</input>
 <input id="a"name="a" type="checkbox" value="3" checked="checked" >C</input>
<button onclick="send_query(????)">CLICK</button>

以下是我的JavaScript函数

function send_query(check) {
var str = "";
    for (i = 0; i < check.length; i++) {

        if (check[i].checked == true) {
            str = str + check[i];
        }
 console.log(str);

}

Answer 1

您可以为按钮编写一个onclick处理程序，可以创建一个单击的复选框值数组，然后使用如下所示的参数调用send_query

<button onclick="onclickhandler()">CLICK</button>

然后

function onclickhandler() {
    var check = $('input[name="a"]:checked').map(function () {
        return this.value;
    }).get();
    console.log(check);
    send_query(check)
}

注意：我还建议使用jQuery注册click处理程序，而不是使用内联onclick处理程序。

注意：ID元素在文档中也必须是唯一的...您有多个ID为a的元素，我没有看到您在任何地方使用该ID，所以您可以可能会将其删除

Answer 2

试试这个

<form name="searchForm" action="">
    <input type="checkbox" name="categorySelect[]" id="1"/>
    <input type="checkbox" name="categorySelect[]" id="2" />
    <input type="checkbox" name="categorySelect[]" id="3"/>
    <input type="button" value="click" onclick="send_query();"/>
</form>

JS

function send_query() {
var check = document.getElementsByName('categorySelect[]');
var selectedRows = [];
for (var i = 0, l = check.length; i < l; i++) {
    if (check[i].checked) {
        selectedRows.push(check[i]);
    }
}

alert(selectedRows.length);
}

Answer 3

使用纯javascript（demo）（仅使用Chrome测试）。

HTML：

<button onclick="send_query(document.getElementsByTagName('input'))">

Javascript：

function send_query(check) {
    var values = [];
    for (i = 0; i < check.length; i++) {
        if (check[i].checked == true) {
            values.push(check[i].value);
        }
    }
    console.log(values.join());
}

如何使用javascript中的onclick将数组中的复选框值传递给函数

3 个答案: