Как удалить div перед добавлением

Question

Я использую Freebase Search Предложите связать определенное ключевое слово с запросом getJson. Проблема в том, что я связываю функции getJson и соответствующие функции .append/.prepend с полем ввода, в котором есть поиск. Теперь, если вы хотите очистить (пустым) мой div, содержащий результат от функций getJson, я не могу ничего добавить.

Таким образом, каждый раз, когда я выполняю поиск, результат div остается пустым. Если я не пытаюсь запустить пустую функцию и выполнить второй поиск, новая информация добавляется поверх предыдущей информации.

Мой сайт www.karsten-tietje.dk/sw

$('#myinput').suggest({key: "<mykey>","filter": "(all type:/music/musical_group)" 

     }) 
     .bind("fb-select", function(e, data) { 

$.getJSON("http://ws.spotify.com/search/1/track.json?q="+search_val, function(data) { 
    items = []; 

     $.each(data["tracks"], function(key, val) { 
     items.push('<li class="spot"><span typeof="MusicRecording" property="track"><p>Name: <strong><span property="name">' + val["name"] + '</span></span></strong></p> <p>Album <strong>' + val.album["name"] + '</strong></p><p> Released: <strong>' + val.album["released"] +'</strong></p><p><strong><a href="' + val["href"] +'"><i class="icon-play-sign"></i> Start Spotify</a></strong></p>'); 
      if (key === 7) 
      { 
      return false; 
      } 
     }); 

     $('#spotify-div').prepend('<h3 style="border-bottom:1px solid white;">Spotify tracks</h3>'); 
     $('#spotify').html(items.join('</li>')); 
    }); 
}); 

Это только отрывок из моего некоторые из моего кода. Я запускаю несколько функций getJson.

Как я могу очистить/удалить свой результат div перед запуском других функций?

Answer 1

Многие люди объяснили механику очистки, что это звучит, как вы уже поняли, поэтому, возможно, отсутствует кусок когда, чтобы сделать это. Вероятно, вы хотите очистить вещи, поскольку самое первое, что вы делаете в своем Freebase Suggest, выбрать обратный вызов, прежде чем запускать любой из запросов другим сервисам, таким как Spotify (то есть перед первым $ .getJSON()).

Не связано с вашим вопросом, но не забывайте о требовании атрибуции лицензии Freebase (в настоящее время не предоставляется на вашем веб-сайте).

EDIT: Вот ваш код с пустым добавил:

$('#myinput').suggest({key: "<mykey>","filter": "(all type:/music/musical_group)" 

     }) 
.bind("fb-select", function(e, data) { 
    $('#spotify-div').empty(); // empty the div before fetching and adding new data 
    $.getJSON("http://ws.spotify.com/search/1/track.json?q="+search_val, function(data) { 
     items = []; 
     $.each(data["tracks"], function(key, val) { 
      items.push('<li class="spot"><span typeof="MusicRecording" property="track"><p>Name: <strong><span property="name">' + val["name"] + '</span></span></strong></p> <p>Album <strong>' + val.album["name"] + '</strong></p><p> Released: <strong>' + val.album["released"] +'</strong></p><p><strong><a href="' + val["href"] +'"><i class="icon-play-sign"></i> Start Spotify</a></strong></p>'); 
      if (key === 7) 
      { 
      return false; 
      } 
     }); 

     $('#spotify-div').prepend('<h3 style="border-bottom:1px solid white;">Spotify tracks</h3>'); 
     $('#spotify').html(items.join('</li>')); 
    }); 
}); 

Answer 2

Выберите элемент и положить HTML пустым, как ниже

jQuery('#selector').html('');

затем после применения функции append Jquery на одного селектора, как показано ниже

jQuery('#selector').append("<p>text</p>");

Answer 3

Вы также можете сделать это путем очистки внутреннего html html, с идентификатором "spotify":

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

Answer 4

С помощью jQuery может быть много способов опорожнения элемента его содержимого и добавления/добавления содержимого.

Один .empty(); (Documentation)

$('#spotify-div').empty().prepend('<h3>YourHTML Here</h3>'); 

Другой является .html([ html ]); (Documentation)

$('#spotify-div').html('').prepend('<h3>YourHTML Here</h3>'); 

Если вы изменяете HTML и не беспокоиться о сохранении событий, вы могли бы просто передайте свой html через функцию .html('Your HTML');

$('#spotify-div').html('<h3>YourHTML Here</h3>');