Custom-form-elements.js로 스타일이 지정된 요소를 선택하려면 OnChange 이벤트를 어떻게 추가합니까?

Question

이 제품은 OnChange 이벤트 호출 잘 작동하지 :

<FORM> 
<SELECT ONCHANGE="alert(this.name + ' changed: ' + this.value)"> 
<OPTION VALUE="1">Option 1</OPTION> 
<OPTION VALUE="2">Option 2</OPTION> 
<OPTION VALUE="3">Option 3</OPTION> 
</SELECT> 
</FORM> 

을하지만이 스타일 패키지를 사용할 때 :

는

http://ryanfait.com/resources/custom-checkboxes-and-radio-buttons/

OnChange 이벤트는 더 이상 작동합니다.

<FORM> 
<SELECT class="styled" ONCHANGE="alert(this.name + ' changed: ' + this.value)"> 
<OPTION VALUE="1">Option 1</OPTION> 
<OPTION VALUE="2">Option 2</OPTION> 
<OPTION VALUE="3">Option 3</OPTION> 
</SELECT> 
</FORM> 

어쨌든 custom-form-elements.js로 OnChange 이벤트를 만드시겠습니까?

감사합니다.

Answer 1

대답은 당신이에 링크 된 페이지에

) 바닥에

스크롤 읽을 것입니다 :

의 onChange 및 기타 자바 스크립트 이벤트

이 스크립트는 자바 스크립트의의 onChange를 이용 및 기타 이벤트. 이벤트는 한 번만 사용할 수 있기 때문에 이벤트에 기능을 추가하려면 내 스크립트에서 해당 이벤트를 호출해야합니다.

:: 편집 :

Custom.clear 및 Custom.choose 기능은 onChange 이벤트에서 호출됩니다 모두 기능은 다음과 같습니다.

clear: function() { 
    // add your code here. example: 
    alert(this.name + ' changed: ' + this.value); 

    inputs = document.getElementsByTagName("input"); 
    for(var b = 0; b < inputs.length; b++) { 
     if(inputs[b].type == "checkbox" && inputs[b].checked == true && inputs[b].className == "styled") { 
      inputs[b].previousSibling.style.backgroundPosition = "0 -" + checkboxHeight*2 + "px"; 
     } else if(inputs[b].type == "checkbox" && inputs[b].className == "styled") { 
      inputs[b].previousSibling.style.backgroundPosition = "0 0"; 
     } else if(inputs[b].type == "radio" && inputs[b].checked == true && inputs[b].className == "styled") { 
      inputs[b].previousSibling.style.backgroundPosition = "0 -" + radioHeight*2 + "px"; 
     } else if(inputs[b].type == "radio" && inputs[b].className == "styled") { 
      inputs[b].previousSibling.style.backgroundPosition = "0 0"; 
     } 
    } 
}, 
choose: function() { 
    // add your code here. example: 
    alert(this.name + ' changed: ' + this.value); 

    option = this.getElementsByTagName("option"); 
    for(d = 0; d < option.length; d++) { 
     if(option[d].selected == true) { 
      document.getElementById("select" + this.name).childNodes[0].nodeValue = option[d].childNodes[0].nodeValue; 
     } 
    } 
} 

주 : 그래서 내 생각 엔 당신이 다음과 같이 JS 파일을 수정하고 나오는 것을 볼 수있다 코드를 쓰는 대신 덩어리를 JS 파일에, 당신은 당신이에서 한 번 정의 함수를 자신의 전화 만한다 clear 및/또는 choose 기능입니다.

Answer 2

나는이 문제를 해결하는 가장 우아한 방법은 아니지만, span 태그 안에 라디오 버튼을 넣고 거기에서 onclick 이벤트를 호출했다. 이 일은 날 동안 미친 drome ... 희망이 도움이