프로토 타입 요소. 여러 객체를 업데이트합니다

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

  •  12-09-2019
  •  | 
  •  

문제

프로토 타입의 새로운 요소 기능이있는 테이블을 구성하려고합니다. 전체 내용으로 Thead를 업데이트 할 때 Firefox에서 문제가 발생했습니다. 모든 요소와 내용. Firefox는 태그를 제거하고 내용 만 표시합니다.

어쨌든 나는 모든 단일 요소를 구성하기로 결정한 다음 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() 기능?

감사!

도움이 되었습니까?

해결책

편집하다

당신이 "th"요소를 "thead"에 추가하고 있다는 것은 단지 나에게 뛰어 들었다. 이것은 나쁘다! thead에는 tr 만 포함해야합니다. TR은 TH를 포함 할 수 있지만 THEAD를 사용하는 경우 대신 TD를 사용합니다.

기억하십시오 : tbody, thead 및 tfoot은 테이블의 세분화이며 ~ 해야 하다 TR 요소를 포함합니다. 결과는 예측할 수 없으므로 TD 또는 TH 요소를 직접 넣어서는 안됩니다.

최종 편집

여기서 문제는 요소 .update ()가 문자열, HTML 스 니펫 또는 Tostring (예 : 요소)을 구현하는 JavaScript 객체를 전달해야한다는 것입니다. 그러나 요소는 사용하는 동안 '+'연산자를 지원하지 않으며 볼 수 있듯이 객체 이름을 추가합니다. 각 어린이의 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