web-dev-qa-db-ja.com

追加する前にdivを空にする方法

Freebase Search Suggestを使用して、特定のキーワードをgetJsonリクエストにバインドしています。問題は、getJson関数と対応する.append/.prepend関数を、検索候補を含む入力フィールドにバインドすることです。 getJson関数の結果を含むdivをクリア（.empty）したい場合、最終的には何も追加できなくなります。

したがって、検索を実行するたびに、結果のdivは空のままになります。空の関数を実行して2回目の検索を実行しないと、新しい情報が前の情報の上に追加されます。

私のサイト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をクリア/空にするにはどうすればよいですか？

javascriptjqueryfreebase
10
Karsten Tietje

elementを選択し、以下のようにHTML空白を入れます

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

次に、以下のような同じセレクタにappend jquery関数を適用した後

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

8
Sumit

IDが「spotify」のHTMLの内部htmlをクリアすることでもこれを行うことができます。

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

JQueryを使用すると、コンテンツの要素を空にし、コンテンツを追加/追加する多くの方法があります。

1つは.empty();（ Documentation ）

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


もう1つは.html( [ html ] );（ Documentation ）

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

Htmlを変更していて、イベントを保持することを心配していない場合は、.html( 'Your HTML' );関数を介してhtmlを渡すことができます。

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