如何清除ajax成功显示的先前搜索结果? [英] How to clear previous search result shown by ajax success?

问题描述

我想清除ajax搜索显示的所有搜索结果，例如当用户键入下一个查询时它将对其进行更新.

I wanted to clear all the search result shown by ajax search like when the user type for next query it will update it.

 $(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成功的结果，请让我知道另一种方法.我想清除以前的结果并更新新结果.

This is my html file for table where i was appending result from ajax success, can you guys let me know another technique for this. I wanted to clear previous result and update the new result.

<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(标题)并使用以下代码，请使用下面的代码.其余数据

On the start of the success handler, use the below code if you want to keep the first tr (headings) and remove the rest of the data

$("#list_table_json").find("tr:gt(0)").remove();

，或者如果您要删除所有内容，请使用

or use if you want to remove everything

$("#list_table_json").empty(); 

或另一种删除所有内容的方法

$("#list_table_json").html('');

如何使用?

success: function(result) { 
    $("#list_table_json").find("tr:gt(0)").remove();
    var event_data = '';

这篇关于如何清除ajax成功显示的先前搜索结果?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！