Javascript : Unexpected token}

Question

this.value를 인수로 전달할 때 예기치 않은 토큰} 오류가 계속 발생합니다. 내 몸에서

내가 가진 :

<input type="text" size="3" id="rbgTextbox" onkeypress="if (ValidateRGBTextboxInput(event)) ChangeBackgroundColor("+this.value+"); else return false;"> 

기능 :

<script type="text/javascript"> 
    function ValidateRGBTextboxInput(e) { 
     return ById('rbgTextbox').value.length < 6 && 
     (e.which >= 48 && 
     e.which <= 57 || 
     e.which >= 65 && 
     e.which <= 70 || 
     e.which >= 97 && 
     e.which <= 102); 
    } 

    function ChangeBackgroundColor(color) { 
     alert(color); 
     ById('gameArea').style.backgroundColor = '#'+color; 
     ById('nextPiece').style.backgroundColor = '#'+color; 
    } 
    </script> 

내가 ChangeBackgroundColor를 변경하는 경우 ("+ this.value +"); ChangeBackgroundColor ('000000')에 대한; 더 이상의 오류는 없지만 물론 텍스트 입력 값을 인수로 전달해야합니다.

Answer 1

따옴표가 필요하지 않습니다. 큰 따옴표를 사용하면 입력 필드의 onkeypress 속성에 필요한 문자열을 무시합니다.

<input type="text" 
     size="3" 
     id="rbgTextbox" 
     onkeypress="if (ValidateRGBTextboxInput(event)) ChangeBackgroundColor(this.value); else return false;"> 

이 popular post on SO

당신이 자바 스크립트에서 따옴표를 이해하는 데 도움이 될 수 있습니다) 그 말이 바랍니다.

Answer 2

if 문을 함수에 배치하고 함수를 호출 해보십시오. 그것은 두 가지 일을 성취 할 것입니다. 코드를보다 쉽게 ​​읽을 수있게 해줄뿐 아니라 if와 else 내에서 쉽게 알리미를 배치하여 실제로 진행되고있는 작업을 볼 수 있습니다.

Answer 3

저는 this.value + '문장이 this.value가 필요하다고 생각하지 않습니다.

또한 HTML에 클릭 핸들러를 추가하고 아래에 표시된 것처럼 추가 로직을 피할 것을 제안합니다.

http://jsfiddle.net/9BtAM/13/

주 나는 당신의 디자인 요소 값은 키를 눌러 이벤트 후 전까지 설정되지 않기 때문에 더 향상시킬 필요가있다 생각합니다. 따라서 기존 요소 값에 수용 가능한 경우 새 키를 연결해야합니다. 따라하기 매우 쉽다 여기

function CheckKeyPress(event) { 
    var element = document.getElementById('rbgTextbox'); 

    if (ValidateRGBTextboxInput(keyPressEvent)) 
     ChangeBackgroundColor(element.value); 
    else 
     return false; 
} 

자바 스크립트와

<input type="text" size="3" id="rbgTextbox" onkeypress="CheckKeyPress(event);" /> 

. 일반적으로 HTML에서 복잡한 자바 스크립트를 직접적으로 원하지는 않습니다.