2016-07-24 12 views
-1

私の状況: 私はAJAXによって要素に検索結果を読み込むという要素があります。結果負荷後(jqueryの)elemtentを追加する方法 HTMLjquery ajaxの内容の後に追加

<input class="search"> 
<div class="search-results"> 
    // in default is empty 
    // after search add <a></a> 
</div> 

jqueryの

$("input.search").change(function() { 
    $(".search-results").append('<div class="searchResultsOverlay"></div>'); 
}); 

? 入力時に.changeを試みますが、これは部分的に解決です。 .change関数を使用しているとき、appendは入力時に働いていますが、入力の外側をクリックすると、入力にカーソルを置くと、結果がロードされ、アクションを待って追加されます。

Ajaxにコンテンツを追加した後、どのようにjQueryを呼び出すのですか?

THX

+0

あなたはページにjqueryを持っていますか –

+0

あなたのコードにはajaxリクエストはありません。もしあなたのajaxコールを提供してください。 –

+0

ajaxロード検索が済んだあと、AJAX成功関数内にjquery関数を入れてみてください – Vaibhav

答えて

0

使用jQueryのからkeyupイベント

$(".search").keyup(function() { 
    $(".search-results").html('<div class="searchResultsOverlay"></div>'); 
}); 
0

Ajaxデータオブジェクトのプロパティsuccessを宣言し、それがコールバック関数です。次にブロックsuccessに何でもしてください。

$.ajax({ 
    success: function(response) { 
     /* Whatever; response is the server response */ 
    } 
}); 
1

$.ajax()PromiseのすべてのメソッドとjqXHRオブジェクトを返します。したがって、XHRの結果が返されたときに.done(function(data, textStatus, jqXHR) {})を使用してコードを実行することができます。一例として、

...ここ
$.ajax({ 
    url: "http://fiddle.jshell.net/favicon.png", 
    beforeSend: function(xhr) { 
     xhr.overrideMimeType("text/plain; charset=x-user-defined"); 
    } 
}) 
.done(function(data) { 
    if (console && console.log) { 
     console.log("Sample of data:", data.slice(0, 100)); 
    } 
}); 

はjqXHRオブジェクトから入手できる他のいくつかの方法が

jqXHR.done(function(data, textStatus, jqXHR) {}); 
jqXHR.fail(function(jqXHR, textStatus, errorThrown) {}); 
jqXHR.always(function(data|jqXHR, textStatus, jqXHR|errorThrown) { }); 
jqXHR.then(function(data, textStatus, jqXHR) {}, function(jqXHR, textStatus, errorThrown) {}); 

は、それらのそれぞれの詳細についてはこちらをご覧くださいです:http://api.jquery.com/jquery.ajax/#jqXHR

関連する問題