プロトタイプ要素。複数のオブジェクトを更新する

StackOverflow https://stackoverflow.com/questions/1111337

  •  12-09-2019
  •  | 
  •  

質問

PrototypeのNew Element関数を使ってテーブルを構築しようとしています。完全なコンテンツでヘッドを更新しているときに、Firefox で問題が発生しました。すべての要素とコンテンツ。Firefox はタグを削除し、コンテンツのみを表示していました。

とにかく、私はすべての要素を構築し、それをtheadに追加することにしました。 Element.update() 関数。しかし、この関数で複数のオブジェクトを追加する方法は見つかりませんでした。

th 要素は次のようになります。

var thead_amount = new Element('th', {
    'id': 'amount'
}).update('amount');

これはうまくいきます:

new Element('thead').update(thead_amount);

これは上記と同じものを出力します。

new Element('thead').update(thead_amount, thead_pdf, thead_tags, thead_date, thead_options);

これは出力します [object HTMLTableCellElement][object HTMLTableCellElement][object HTMLTableCellElement][object HTMLTableCellElement][object HTMLTableCellElement]

new Element('thead').update(thead_amount + thead_pdf + thead_tags + thead_date + thead_options);

プロトタイプに複数のオブジェクトを追加するにはどうすればよいですか? update() 関数？

ありがとう！

役に立ちましたか？

解決

編集

「THEAD」に「TH」の要素を加えているのが目に浮かびました。これは悪いです！THEAD には TR のみを含める必要があります。TR には TH を含めることができますが、THEAD を使用している場合は代わりに TD を使用します。

覚えて：tbody、thead、および tfoot は table の下位部分であり、 しなければならない tr要素が含まれています。結果はよく見ても予測不可能であるため、これらの要素に td または th 要素を直接入れないでください。

編集終了

ここでの問題は、Element.update() に文字列、HTML スニペット、または toString を実装する JavaScript オブジェクト (例:要素）。ただし、Element は、使用している「+」演算子をサポートしておらず、表示されているようにオブジェクト名を加算します。次のように、各子に対して toString メソッドを明示的に呼び出す必要があります。

new Element('thead').update(thead_amount.toString()
  + thead_pdf.toString() 
  + thead_tags.toString() 
  + thead_date.toString() 
  + thead_options.toString());

アプリで script.aculo.us (プロトタイプ拡張機能) を使用している場合は、Builder クラスを使用して要素の構築を容易にすることができます。特に多数の要素を作成する場合に、より直感的なインターフェイスが提供されます。以下に例を示します。

var table = Builder.node('table', {
  width: '100%',
  cellpadding: '2',
  cellspacing: '0',
  border: '0'
});

var tbody = Builder.node('tbody'),
    tr = Builder.node('tr', { className: 'header' }),
    td = Builder.node('td', [Builder.node('strong', 'Category')]);

tr.appendChild(td);
tbody.appendChild(tr);
table.appendChild(tbody);

$('divCat').appendChild(table);

チェックアウト http://wiki.github.com/madrobby/scriptaculous/builder 詳細については。

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top