Question

我有一个选择下拉列表，我可以显示/删除脚本中的条件输出，除了一个。我遇到的问题是删除/删除$ .each创建的行。我还是js的新手，我已经在网上寻找解决方案，但我还是无法让它工作。到目前为止，这是我的代码。

<table id="view_programs" class="table table-striped table-bordered">
    <thead>
        <tr>
            <th>Year</th>
            <th width="12%">Action</th>
        </tr>
    </thead>
    <tbody>
        <tr id="toBeRemoved">
            <td colspan="2">No program selected.</td>
        </tr>   
    </tbody>
</table>

脚本

if(selectedValue == '') {
    $("#delbutton").hide();

    $("#toBeRemoved td").remove();
    $("#toBeRemoved").append(
        $("<td colspan='2'>").html("No program selected.")
    ).appendTo('#view_programs');
}
else {
    $.ajax({
        url: '<?php echo site_url("query.php");?>',
        type: 'post',
        data: {option: selectedValue},
        dataType: 'json',
        success: function(response) {
            $("#delbutton").show().attr("href", "delete/program/"+encodeURIComponent(selectedValue));

            if(jQuery.isEmptyObject(response)) {
                $("#toBeRemoved td").remove();
                $("#toBeRemoved").append(
                    $("<td colspan='2'>").html("No records found.")
                ).appendTo('#view_programs');
            }
            else {
                var trHTML = '';
                $.each(response, function(key, value) {
                    trHTML += "<tr><td>"+value+"</td><td>"+value+"</td></tr>";
                });
                $('#view_programs').append(trHTML);
            }

            console.log(response);
        }
    });
}

更新感谢西蒙先生给我一些启示，实现了我想要的。我怀疑我的代码会更好，所以我可以接受任何建议。

改变了这个

<tbody>
    <tr id="toBeRemoved">
        <td colspan="2">No program selected.</td>
    </tr>   
</tbody>

进入这个

<tbody class="toBeRemoved">
    <tr>
        <td colspan="2">No program selected.</td>
    </tr>   
</tbody>

和这个

$('#view_programs').append(trHTML);

进入这个

$('.toBeRemoved').append(trHTML);

并将所有#toBeRemoved转换为.toBeRemoved

Answer 1

您将表格行追加到#view_programs的末尾，这意味着在</tbody>元素之后......所以他们没有您想要的#toBeRemoved ID删除我猜？

如果要删除多行，请确保使用类（即.toBeRemoved）而不是ID。 Ids只是一个元素的唯一标识符。

jQuery从ajax响应中操作表行

1 个答案: