2

ajaxを使用して木々の木材が表示されないFirefoxの問題が発生している場合、phpスクリプトからhtmlソースを取得します

このhtmlコードにはタグが含まれており、tbody内にさらにいくつかのtr/tdが含まれています

ここで、このtbodyプレーンコードを既存のテーブルに追加します。ただし、もう1つの条件があります。テーブルはフォームの一部であるため、チェックボックスとドロップダウンが含まれています。table.innerHTML +=contentを使用する場合; Firefoxはテーブルをリロードし、その中のすべての要素をリセットします。

私が持っているのはこれです

// content equals transport.responseText from ajax request
function appendToTable(content){
    var wrapper = document.createElement('table');
    wrapper.innerHTML = content;
    wrapper.setAttribute('id', 'wrappid');
    wrapper.style.display = 'none';
    document.body.appendChild(wrapper);

    // get the parsed element - well it should be
    wrapper = document.getElementById('wrappid');
    // the destination table
    table = document.getElementById('tableid');

    // firebug prints a table element - seems right
    console.log(wrapper);
    // firebug prints the content ive inserted - seems right
    console.log(wrapper.innerHTML);

    var i = 0;
    // childNodes is iterated 2 times, both are textnode's
    // the second one seems to be a simple '\n'
    for(i=0;i<wrapper.childNodes.length;i++){
        // firebug prints 'undefined' - wth!??
        console.log(wrapper.childNodes[i].innerHTML);
        // firebug prints a textnode element - <TextNode textContent=" ">
        console.log(wrapper.childNodes[i]);
        table.appendChild(wrapper.childNodes[i]);
    }
    // WEIRD: firebug has no problems showing the 'wrappid' table and its contents in the html view - which seems there are the elements i want and not textelements
}

これは非常に些細なことで問題が見当たらないか、そのコーナーケースであり、ここの誰かがこれについてアドバイスを与えるために多くの経験を持っていることを願っています-誰もが私が期待する最終的に解析されたdom要素ではなくテキストノードを取得する理由を想像できますか？

ところで：ところで、完全な例を示すことはできません。テストセットではなく、実際に発生するバグの1つである、動作しない小さなコードを記述できません。

thx all

4

3 に答える 3

2

あなたはおそらく、W3C仕様に従うというFirefoxの癖に遭遇しているでしょう。仕様では、タグ間の空白は要素ではなく「テキスト」ノードです。これらのTextNodeはchildNodeで返されます。この他の回答は回避策を説明しています。また、JQueryのようなものを使用すると、これがはるかに簡単になります。

于 2010-04-19T16:30:03.850 に答える
0

+ =オペランドは、定義上、テーブルにすでに存在するものを上書きするため、どのブラウザでもこの動作を期待します。2つの解決策：

PHPファイルからHTMLコードを受け取る代わりに、PHPにアイテムのリストを生成させてテーブルに追加します。カンマ/タブ分離、何でも。次に、Table.addRow（）、Row.addCell（）、およびcell.innerHTMLを使用して、アイテムをテーブルに追加します。これは私が提案する方法であり、2つの別々のファイルにGUI要素を作成する意味はありません。

もう1つの解決策は、ローカルJavaScript変数にすでに入力されているすべてのフォームデータを保存し、テーブルを追加してから、データをフォームフィールドに再ロードすることです。

于 2010-04-19T17:31:40.533 に答える
0

ええと、新しいデータでJSONオブジェクトを返すのが最良のオプションのようです。次に、それを使用して追加のテーブル要素を合成できます。

応答としてプレーンHTMLを取得する必要がある場合はvar foo = document.createElement('div');、たとえば、を使用してから実行することができますfoo.innerHTML = responseText;。これにより、何にも追加されない要素が作成されますが、解析されたHTML応答がホストされます。
次に、要素をドリルダウンし、foo必要な要素を取得して、DOMに適した方法でテーブルに追加できます。

編集：

さて、私はあなたのポイントを今見ていると思います。
wrapperテーブル要素自体です。ノードはtbodyの下にあり、その子wrapperはその子です（または、FirefoxではlastChildそのメンバーを介してノードにアクセスできます）。 そして、tBody要素を使えば、欲しいものが手に入ると思います。 tBodies[0]

ところで、子をテーブルに追加する前にドキュメントにラッパーを追加する必要はないので、非表示にする必要はありません。

于 2010-04-20T01:48:02.820 に答える