즉, IE의 "This"키워드

Question

그래서 나는이 스 니펫을 사용합니다 <tr onclick="this.toggleClassName('selected')"> 웹 페이지에서. (프로토 타입 .js 함수) 훌륭하게 작동합니다. 내가하는 일은 테이블 행을 클릭하는 것입니다. 선택한 것으로 보입니다. IE와 오페라를 제외한 모든 곳에서 작동합니다. 이것은 편리한 일이므로 실제로 작동하는지 신경 쓰지 않지만 즉, 오류를 던지고 사용자에게 디버그하고 싶은지 묻습니다.

내가 얻는 오류 메시지는 "객체 가이 속성이나 방법을 지원하지 않습니다"입니다. 어떤 객체 또는 어떤 방법을 참조 할 수 있습니까? IE 에서이 기능을 구현하는 쉬운 방법에 대한 생각이 있습니까? 오류 메시지를 사용자에게 버리지 않는 것은 어떻습니까?

감사합니다, 데이브

(http://math.davehampson.net)

Answer 1

예, 이것은 기본적으로 프로토 타입의 주요 문제입니다.

프로토 타입은 브라우저에서 다르게 작동합니다. 호스트 오브젝트의 프로토 타입 (htmltablerowelement와 같은)을 가지고 재생할 수있는 브라우저에서는 다음과 같은 자체 기능을 추가합니다. toggleClassName 해당 프로토 타입에 <tr> 해당 메소드를 직접 호출 할 수 있습니다. 우후, 얼마나 편리합니다!

불행히도, DOM 노드의 프로토 타입을 변경할 수 있다는 것은 ECMAScript 또는 DOM 표준이 실제로 승인되지 않는 것입니다. Mozilla는 그렇게 좋기 때문에 Firefox에서 작동하지만 모든 브라우저에서 작동 할 것으로 기대할 수는 없습니다. 그것은 확실히 IE에서 작동하지 않을 것입니다.

따라서 다른 브라우저의 경우 프로토 타입을 알려 주어야합니다.

Element.extend(this);

이제 전화 할 수 있습니다 this.toggleClassName 모든 브라우저에 안전하게.

일단 당신이 그 특별한 것을 확대 한 후에 <tr>, 미래에 액세스 할 때마다 여전히 확대 될 것이므로 여전히 전화 할 수 있습니다. toggleClassName 그 위에. 또한, 프로토 타입 방법을 통해 요소에 액세스하는 경우 $('mytrid')- 자동으로 당신을 위해 그것을 증대시킬 것입니다.

이것은 편의 기능이 아닙니다. 이것은 함정입니다. 브라우저에서 작동하는 코드 (프로토 타입 사업 지원)에서 작동하는 코드를 작성하지만 다른 곳에서는 실패합니다. 특정 순서로 페이지 요소와 상호 작용하는 경우 작동하는 코드를 작성하는 것이 좋습니다. 증강 방법이 호출되기 전에 모두 증강되도록하지만 다른 순서로 요소와 상호 작용하면 넘겨집니다.

이것은 디버깅 재해이므로 프로토 타입을 사용하지 않는 이유입니다.

(다음 주에, 여분의 불꽃 재미를 위해, 내가 jQuery를 사용하지 않는 이유.)

Answer 2

대신 이것을 사용해보십시오.

$(this).toggleClassName('selected')

여기에 자세한 이유 : http://prototypejs.org/learn/extensions/

Answer 3

'이'키워드는 JavaScript 기본이며 예에서 TR DOM 노드를 반환합니다. 프로토 타입이 DOM 노드에 메소드를 첨부하고 있다고 생각하며, 어떤 이유로 IE와 Opera에서는이 작업이 수행되지 않습니다.