onclick을 사용할 때 내 사용자 스크립트에 \'Uncaught ReferenceError: Function Not Defined\' 오류가 발생하는 이유는 무엇이며 어떻게 해결할 수 있습니까?

잡히지 않은 참조 오류: OnClick으로 정의되지 않은 함수

사용자 스크립트를 사용하여 웹 사이트에 사용자 정의 감정 표현을 추가하려고 하면 "잡히지 않은 참조 오류: onclick 속성이 있는 버튼을 클릭하면 함수가 정의되지 않았습니다.

이해하기 문제

사용자 스크립트는 샌드박스 환경에서 작동하여 대상 웹 페이지 범위 내에 존재하는 기능에 직접 액세스할 수 없습니다. onclick 속성은 이 웹 페이지 범위를 활용하므로 사용자 스크립트에서 사용될 때 실패하게 됩니다.

해결책: addEventListener() 사용

이 문제를 해결하려면 onclick() 및 유사한 속성을 사용하지 마십시오. 사용자 스크립트에서. 대신 이 목적을 위해 addEventListener() 메서드(또는 jQuery .on()와 같은 동등한 라이브러리 함수를 선택하세요.

코드 다시 작성

예를 들어 onclick을 사용하는 다음 코드는 다음과 같습니다.

something.outerHTML += '<input onclick="resetEmotes()">

addEventListener()를 사용하여 다시 작성할 수 있습니다:

something.outerHTML += '<input>

루프 및 이벤트 리스너 수정

또한 다음과 같은 코드를 사용하여 이벤트 리스너에 직접 데이터를 전달하는 것을 피하세요.

emoteTab[2].innerHTML += '<span>

대신 아래와 같이 데이터 속성을 사용하고 이벤트 리스너를 별도로 추가하세요.

for (i = 0; i < EmoteURLLines.length; i++) {
  if (checkIMG(EmoteURLLines[i])) {
    emoteTab[2].innerHTML += '<span>

부록에Emote 함수:

function appendEmote(zEvent) {
  var emoteUsage = this.getAttribute("data-usage");
  shoutdata.value += emoteUsage;
}

경고

동일한 ID는 유효하지 않으므로 여러 요소에 재사용하지 마세요. 각 페이지에는 특정 ID의 인스턴스가 하나만 있을 수 있습니다.

또한, .outerHTML 또는 .innerHTML은 영향을 받은 노드에서 기존 이벤트 핸들러를 제거하므로 사용 시 주의하세요.

위 내용은 onclick을 사용할 때 내 사용자 스크립트에 \'Uncaught ReferenceError: Function Not Defined\' 오류가 발생하는 이유는 무엇이며 어떻게 해결할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!