2013-10-03 3 views
1

라디오 버튼 중 하나를 선택할 때 텍스트 필드에 특정 텍스트를 표시하려고하는 HTML 양식이 있습니다. 지금까지, 버튼을 클릭하면 텍스트 필드에 적절한 텍스트가 표시됩니다. 내 목표는 라디오 버튼을 선택하면 "클릭"버튼을 제거하고 텍스트 필드에 텍스트를 즉시 표시하도록하는 것입니다. Javascript에서는 어떻게 할 수 있습니까?라디오 버튼을 선택하면 텍스트 필드 채우기

텍스트 필드에 'OnKeyUp'이벤트가 있음을 알고 있지만 라디오 버튼에 선택 시점을 결정할 수있는 유사한 기능이 있는지 알 수 없습니다. OnChange 및 OnFocus 이벤트를 시도했지만 어쩌면 그 일을 제대로 수행 할 수 없기 때문에 잘못하고 있습니다. 모든 제안은 대단히 감사하겠습니다.

내가 지금까지 무엇을 가지고 : 문제가 해결되지 않으면

TYPE="radio" NAME="input" VALUE="red" onchange="testResults(this.form) 
TYPE="radio" NAME="input" VALUE="blue" onchange="testResults(this.form) 

, 그것은 브라우저가 될 수 있습니다

<HTML> 
    <HEAD> 
    <TITLE>Test Input</TITLE> 
    <SCRIPT LANGUAGE="JavaScript"> 
     function testResults (form) { 
     var TestVar1 = form.input[0].checked; 
     var TestVar2 = form.input[1].checked; 
     if (TestVar1 == true) { 
      form.textbox.value = "red"; 
     } else if (TestVar2 == true){ 
      form.textbox.value = "blue"; 
     } else if (TestVar1 == false && TestVar2 == false) { 
      form.textbox.value = ""; 
     } 
     } 
</SCRIPT> 
</HEAD> 
<BODY> 
<FORM NAME="myform" ACTION="" METHOD="POST">Choose a Color: <BR> 
    <INPUT TYPE="radio" NAME="input" VALUE="red">red<P> 
    <INPUT TYPE="radio" NAME="input" VALUE="blue">blue<P> 
    <INPUT TYPE="button" NAME="button" VALUE="Click" onClick="testResults(this.form)"> 
    <P>Selected:</P> <INPUT TYPE="text" ID="textbox" NAME="selected" VALUE=""></div><p> 

</FORM> 
</BODY> 
</HTML> 

답변

2

변경을 onchange를 이벤트를 추가하는 다음 두 줄의 코드 . document.getElementByID는 모든 브라우저를 제외한 객체입니다

+0

감사합니다! 나는'testResults (this.form)'에서'this'를 잊었습니다. –

+0

다른 브라우저에서의 동작에 대한 메모 : Firefox에서는 훌륭하게 작동합니다! Internet Explorer에서 변경 사항이 인식되기 전에 라디오 단추 외부를 클릭해야합니다. –

관련 문제