2011-01-09 15 views
2

私はajaxコールを持っていますが、返されたページのヘッダーとフッターを削除するために#viewportの返されたページを解析しようとしています。 find()はdivを見つけることができません。jqueryはidでdivを見つけることができません

私の本来の機能:警告(データ)で

 function(event) { 
      $.ajax({ 
       type: this.method, 
       url: this.action, 
       data: $(this).serialize(), 
       datatype: "html", 
       success: function(data) { 
        alert(data); 
        var respHTML = $(data).find("#viewport"); 
        alert(respHTML.length); 
        $("#contacts_sidebar").html(respHTML); 
       } 
      }); 
      return false; 
     } 

i "がtable.someclass" にセレクタを変更した場合、私は間違いなくそれを見つけるだろう、<div id="viewport">が、alert(respHTML.length) 0が表示されます。を参照してください。 "head"や "body"などのセレクタも0を返します。

私はそれがB/C私は次の回避策を成功ハンドラを置き換えるが、間違いなく知っている:

 success: function(data) { 
      var respHTML; 
      var d=$(data); 
      for (i=0; i<d.length; i++) { 
       if (d[i]["id"] === "viewport") { 
        respHTML = d[i]["innerHTML"]; 
        break; 
       } 
      } 
      $("#contacts_sidebar").html(respHTML); 
     } 

私は何かが足りないのですか?回避策は、ちょうど醜い作品。

ありがとうございます。

+3

複数の要素に同じ「id」値を使用するという罪を犯さないでしょうか? – Pointy

+0

IDを検索する前にDOMに要素を追加しましたか?それとも単純なHTMLですか? –

+0

@Caspar Kleijne彼は暗黙のうちに返されたHTMLを '$(data)'と書いて文書の断片に追加しています – Pointy

答えて

7

'#viewport'は、応答HTMLの最上位レベルにある場合.find()のみ内のトップレベルの要素を見ているので、あなたは、代わりに.filter()が必要になります。 jQueryのにHTMLを渡すとき

success: function(data) { 
     alert(data); 
     var respHTML = $(data).filter("#viewport"); 
     alert(respHTML.length); 
     $("#contacts_sidebar").html(respHTML); 
    } 

は、あなたはクロスブラウザの方法で<html><head><body>タグを見つけることに頼ることはできません。

レスポンスにHTML文書全体が含まれている場合は、可能な限り実際に必要なコンテンツのみに回答します。

var respHTML = $('<div>' + data + '</div>').find("#viewport"); 

...しかし、私は結果を保証しません。

別のオプションは、このような何かをすることであってもよいです。

+1

あなたはおそらく何が起こっているかについてあなたは正しいと思います。 – Pointy

+0

これは機能します。どうもありがとうございます!!!! – steve

2

.load()関数を使用して、特定の要素の返されたページを解析できます。

http://api.jquery.com/loadを確認し、ページフラグメントの読み込みに関するセクションを参照してください。

+0

彼はフォームをポストしていますので、 '.load()'は実際にはあまり役に立ちません。 – Pointy

関連する問題