Wikipedia Viewer Ergebnisse duplizieren nach der Suche nach dem zweiten Mal

Question

Ich versuche, einen Wiki-Viewer zu bauen und stieß auf ein kleines Problem.

Ich benutze Wikipedia api. Nach der Eingabe des Suchbegriffs werden dem Benutzer 5 mögliche Artikel (Titel und erster Satz des Artikels) angezeigt und nach dem Anklicken werden diese auf die Wikipedia-Seite weitergeleitet und der Artikel wird vollständig angezeigt.

Nach der Suche nach dem zweiten Mal (Putting in neues Wort) stoße ich auf ein Problem. Es gibt leere divs am unteren Rand der Seite und wann immer der Benutzer versucht, auf den gewünschten Artikel zum weiteren Lesen zu klicken, gibt es zwei geöffnete Wikipedia-Seiten.

Irgendwelche Vorschläge? Hier

$.getJSON('https://en.wikipedia.org/w/api.php?action=opensearch&datatype=json&limit=5&search=' + inputVal + '&callback=?', function(data) { 
       for (var i = 0; i < data[1].length; i++) { 
        $('<div class="item"><h4></h4><p></p></div>').appendTo(".search-area"); 
        $('h4').eq(i).text(data[1][i]); 
        $('p').eq(i).text(data[2][i]); 
       }; 
       $('.item').on('click', function(e) { 
        e.preventDefault(); 

        var wikiLoc = $(this).find('h4').text(); 
        window.open('https://en.wikipedia.org/wiki/' + wikiLoc); 
       }); 

ist voll Code: http://codepen.io/nikasv/pen/pbzrzj

Answer 1

können Sie hinzufügen hinzufügen

$(".item").remove(); 

in Zeile 3, um alle vorherigen Ergebnisse entfernen

$(document).ready(function() { 
     $('button').eq(1).on('click', function(e) { 
      $(".item").remove(); 
      e.preventDefault(); 
      var inputVal = $('input').val(); 
    .... 

http://codepen.io/Crazy/pen/VjZzjG/

Answer 2

Vorher für Schleife hinzufügen $(".search-area").empty()