使用 jquery 从表中删除 tr答案

【问题标题】：remove tr from table using jquery使用 jquery 从表中删除 tr
【发布时间】：2021-11-06 21:51:06
【问题描述】：

我有一个日历，当用户点击任何日期时，它会在右侧显示约会列表。

它工作正常，但问题是当用户点击任何其他日期时，仍然显示以前日期的约会..

所以我需要的是，当用户点击任何新日期时，应隐藏前一个日期的约会并仅显示点击日期的约会。

Blow 是我的代码，还附上了截图。

当用户点击任何日期时，此函数正在调用...

function getEvents(date) {

            events.forEach(function (entry) {
                if (entry['start'] == date.format()) {

                    $("#appointmenttable").css({ "display": "block" });

                    if (entry['appointmentstatus'] == 'Pending') {
                        $("#twobuttons").css({ "display": "block" });
                        $("#onebutton").css({ "display": "none" });
                    } else if (entry['appointmentstatus'] == 'Approved') {
                        $("#onebutton").css({ "display": "block" });
                        $("#twobuttons").css({ "display": "none" });
                    } else {
                        $("#twobuttons").css({ "display": "none" });
                        $("#onebutton").css({ "display": "none" });
                    }

                    var row = $('<tr id="mytablerow"> <td> <div> <img class="logo screen" src="images/placeholder.jpg" style="float:right; width:100px; height:100px;" /> </div> </td>' +
                        '<td> <div>Patient Name : Test</div> <div>Date : <span>' + entry['start'] + '</span></div> <div>Time : <span>' + entry['startt'] + '</span></div>' +
                        '<div>' + entry['title'] + '</div> <div>' + entry['appointmentstatus'] + '</div> </td>' +
                        '<td id="twobuttons" style="display:none;"> <div> <button type="button" id="confirmbutton" class="css_button_new">Confirm</button> </div>' +
                        '<div> <button type="button" id="rejectbutton" class="css_button_new" style="margin-top: 7px;">Reject</button> </div> </td>' +
                        '<td id="onebutton" style="display:none;"> <div> <button type="button" id="cancelbutton" class="css_button_new">Cancel</button> </div> </td>' +
                        '</tr> ');

                    $('#appointmentdetailstable').append(row);
                }
            });

【问题讨论】：

标签： jquery asp.net asp.net-mvc fullcalendar-3

【解决方案1】：

我认为您需要在追加之前清除 $('#appointmentdetailstable') div。目前，您只需将 HTML 添加到 div 的末尾即可。

尝试在代码块的开头运行 $('#appointmentdetailstable').empty();，这样它就不会包含上次触发事件的行数据。

文档：https://api.jquery.com/empty/ + https://api.jquery.com/append/

在这里也可以快速解决：https://jsfiddle.net/d2svbm9o/20/

【讨论】：

【解决方案2】：

$('#appointmentdetailstable').empty();

这解决了我的问题。

非常感谢大家帮助我。

【讨论】：