2012-04-20 23 views
2

私はindex.htmlをで別のDIV(#result)にロードする外部ファイル(test.htmlという)のコンテンツ(#content)があります。jqueryの簡単なAjaxの負荷

test.htmlというの:

<div id="content">This text should not be loaded with its DIV. <strong> May contain other tags</strong></div> 

jqueryの:

$('#result').load('test.html #content'); 

index.htmlの結果、予期しません:

<div id="result"><div id="content">This text should not be loaded with its DIV. <strong> May contain other tags</strong></div></div> 

index.htmlの結果、予想:

<div id="result">This text should not be loaded with its DIV. <strong> May contain other tags</strong></div> 

どのようにしても、他のタグを含むことが#contentの唯一の実際のコンテンツ/ HTMLをロードしますが、唯一のラッパーなしDIV(#content)? 理由は、間違って他のスタイルのDIVと衝突する可能性のある不要な桁を単純に避けることです。

どのようなヒントもありがとうございます。ありがとう

+1

は、あなたのマークアップが(行方不明クロージング「)壊れているように見える応じて更新 – Shyju

+0

おかげで、 – swan

+1

あなたが '.LOADでそれを行うことはできません() ' – zerkms

答えて

1

ここに考えがあります。一時タグをワークスペースとして使用するとどうなりますか?

このjQueryのJavaScriptの

...

$('#workarea').load('test.html #content'); 

が...この結果を生じる可能性があります。ワークエリアが隠されていることに注意してください:

<div id="result"></div> 
<div id="workarea" style="display: none"><div id="content>This text should not be loaded with its DIV</div></div> 

その後、あなたはこれで結果にそれを移動することができ...

$('#result').html($('#workarea').html()); 

それがこの結果を生成する必要があります。

<div id="result">This text should not be loaded with its DIV</div> 
<div id="workarea" style="display: none"><div id="content></div></div> 

編集:

$('#workarea').load('test.html #content'); 
$('#result').html($('#workarea').html()); 

あなたはあなたの代わりに1行の2行を使用します。

ここで完全なスクリプトは、一箇所ですべてです。私が正しく理解していれば、上のクエリで期待される結果が得られるはずです。

+0

申し訳ありませんが、私は取得できませんそれはファイル内のすべてのインラインを意味するのですか?私がexterを使用した理由これらのHTMLが1ページに収まるには多すぎるためです。どうか明らかにしてください。ありがとう。 – swan

+0

@swanはそれを明確にしていますか? 1つのjquery行を2行に変更するだけです。私は説明の中でそれを分割して、それが何を段階的に行っているかを示した。 – digitaleagle

+0

あなたのアイデアは私をより良い解決に導きます。実際にはあなたのほうがはるかに優れていて、HTTPリクエストの数が減ります。単一のHTMLだけをロードし、ロードされたHTMLからIDで分割し、最終的に各IDを親HTMLの小さな桁に挿入します。ブリリアント。どうもありがとう。 – swan

1

.load()の結果をvarに取得できる場合は、 これを行うことができます。

var result = ... load line ... 
var outResult = $(result); 
// now strip the div out of outResult using jquery...... 
outResult = StripContentDiv(outResult); 
$('#result').html(outResult); 

申し訳ありませんが、私はjqueryの専門家ではないよ、私はより具体的にすることはできません。

+0

StripContentDivとは何ですか、それは組み込みのjqueryですか、またはカスタムですか?ありがとう – swan

+0

あなたはこの関数を作成します –

1

は、それはあなたが

$(document).ready(function(){ 
    $('#result').load('test.html #content', function() { 
    $('#content', this).text; 
    }); 
    }); 

を見てthatsのです:。JNE

によるPのxD
+0

ありがとうございますが、残念ながら以下の機能が遅すぎます。 #contentにはすでにそのDIVが読み込まれています。 – swan