プリローダーでAJAXを使用して、ロードページのコンテンツは

Question

私が作成したフィドルは（ここにあります私のコードはかなりがらくたである。）

http://jsfiddle.net/ozzy/Vcwj5/2/

誰かが説明してくださいでした..

私は、ページの読み込み上の特定のdiv（ないローダGIF）を表示する必要が

1. 選択内容には、例えば、 apples.htmlがdivに読み込まれます。
2. コンテンツが取得されている間にローダーが一時的に表示されます。

あなたがapples.htmlをプリロードしたい場合は、<option value="null">--- Please Select---</option>を削除することができます任意の助け

乾杯のサント

Answer 1

ので、それらすべてのファイルが同じドメインに存在し、あなたのコードのこの更新はありがとうが遊びを持っています http://jsfiddle.net/Vcwj5/9/

Answer 2

を感謝しています。​​をdefaultselectedとします。

<select id="myads" name="ads" style="width: 150px;" class="required"> 
    <option value="apples.html" selected >apples</option> 
    <option value="pears.html">pears</option> 
    <option value="carrots.html">carrots</option> 
</select> 


<div id="adshowblock"> 

</div> 
<div class="loader" style="display:none;"> // hide this div, it is to use later 
    <img src="http://carestream.com/images/ajax-loader.gif"></div> 
</div> 

はJQuery：

$("#adshowblock").html($('.loader').html()); // display loader in div 
$("#adshowblock").load("apples.html"); // add this step on document load , loader will be hidden when data is loaded. 
$("#myads").change(function(){ 
    $("#adshowblock").html($('.loader').html()); 
    $("#adshowblock").load($(this).val()); 
});