Question

这是我目前的代码。我想要完成的工作如下。

如果json[i].enabled为真，我需要选中相应的复选框。如果没有，请将其留空。

function createTable(json) {
        var element = "";
        var i;

        for (i = 0; i < json.length; i++) {

            element = element
                    + '<tr><td><input type= "checkbox"/></td><td>'
                    + json[i].a_id + '</td><td>' + json[i].name + '</td><td>'+ json[i].enabled
                    + '</td></tr>';


            if(json[i].enabled== "TRUE"){

                $('checkbox').prop('checked', true);
            }
       }

        //Had forgotten to add this before.
       element = element + '</tbody>';

        $('#dataTable > tbody').remove();

        $("#dataTable").append(element);

 }

我通过包含以下条件来尝试它，但它失败了。

 if(json[i].enabled== "TRUE"){

        $('checkbox').prop('checked', true);
}

那么，我该怎么做呢？如何访问循环中的特定复选框？

谢谢！

Answer 1

尚未在DOM中创建checbox元素。所以你必须把html放在第一位。然后使用

input[type="checkbox"]

匹配实际的复选框元素。最后，您可能希望仅使用此选择器获取最后一个复选框（在表的最后一行中）：

mytable tbody tr：最后一次输入[type =＆＃34;复选框＆＃34;]

所以你有以下代码：

function createTable(json) {
        var i;

        for (i = 0; i < json.length; i++) {
            // construct the html
            element = '<tr><td><input type= "checkbox"/></td><td>'
                    + json[i].a_id + '</td><td>' + json[i].name + '</td><td>'+ json[i].enabled
                    + '</td></tr>';
            // put the html in the page
            $('#mytable tbody').append(element);

            if(json[i].enabled== "TRUE"){
                // get the last inserted line in the table and check the checkbox
                $('#mytable tbody tr:last input[type="checkbox"]').prop('checked', true);
            }
       }
 }

Answer 2

$('input[type="checkbox"]').prop('checked', true);

完整示例：

var $table=jQuery('<table></table>');
for (i = 0; i < json.length; i++) {
    var $tr=jQuery(
            '<tr><td><input type= "checkbox"/></td><td>'
             + json[i].a_id + '</td><td>' + json[i].name + '</td><td>'+ json[i].enabled
              + '</td></tr>');


        if(json[i].enabled== "TRUE"){
            $tr.find('input["checkbox"]').prop('checked', true);
        }
      $table.append($tr);
 }
 $jQuery('body').append($table);

Answer 3

使用字符串连接和三元运算符：

'<tr><td><input type="checkbox"' + ( json[i].enabled== "TRUE" ? ' checked' : '' ) + '/></td><td>'

Answer 4

试试这个：

$('input[type="checkbox"]:eq(i)').prop('checked', true);

在jquery中检查Checkbox

4 个答案: