html - 如何清除ajax成功显示的先前搜索结果?
问题描述
我想清除 ajax 搜索显示的所有搜索结果,例如当用户键入下一个查询时它会更新它。
$(document).ready(function(){
var text;
$("#button").on('click',function (e) {
e.preventDefault();
var q=$("#q").val();
$.ajax({
url: "/search",
data: {q:q},
type: "GET",
dataType : "json",
success: function(result) {
var event_data = '';
for (var i = 0; i < result.length; i++) {
event_data += '<tr>';
event_data += '<td>' + '<img src=' +result[i]['video']['thumbnail_src']+ '></img>' +'</td>';
event_data += '<td>' +result[i]['video']['title']+'</td>';
event_data += '<td>' +result[i]['video']['duration']+ '</td>';
event_data += '<td>' + '<a href' +result[i]['video']['url']+ '>'+ "Download" +'</a>' +'</td>';
event_data += '</tr>';
} $("#list_table_json").append(event_data);
},
error: function(jqxhr, status, exception) {
alert('Exception:', exception);
},
always: function( xhr, status ) {
alert( "The request is complete!" );
}
});
});
});
这是我的表格的 html 文件,我在其中附加了 ajax 成功的结果,你们能告诉我另一种技术吗?我想清除以前的结果并更新新结果。
搜索<table class="table table-responsive table-hover table-bordered" id="list_table_json">
<thead>
<tr>
<th>Thumbnail</th>
<th>Title</th>
<th>Duration</th>
<th>Download</th>
</tr>
</thead>
解决方案
在处理程序开始时,如果要保留第一个(标题)并删除其余数据success
,请使用以下代码tr
$("#list_table_json").find("tr:gt(0)").remove();
或者如果您想删除所有内容,请使用
$("#list_table_json").empty();
或其他删除所有内容的方法
$("#list_table_json").html('');
如何使用?
success: function(result) {
$("#list_table_json").find("tr:gt(0)").remove();
var event_data = '';
推荐阅读
- google-cloud-platform - Helm Kafka,无法更改 Kubernetes pod 的端口
- python - 点击body不关闭弹窗selenium
- r - 热图调整
- django - django.db.utils.IntegrityError: could not create unique index - DETAIL: Key (player)=(Lonergan) is duplicated。- 模型中没有唯一约束
- android - 电子邮件意图值未设置为“TO”:地址
- batch-file - cd 进入与 dir 一起使用的找到文件的目录
- python - 如何解决来自 Xpath 的此错误?
- python-3.x - 将数据框合并为一列中的 None 时省略重复项
- java - WebSocket STOMP 已经覆盖类主体方法 getname() convertAndSendToUser 不起作用
- java - 如果 Firebase 中的另一个子值匹配,如何获取子值?