2013-10-30 4 views
0

질문 : 변수에 입력 텍스트 #userGuess의 값을 가져올 수없는 이유는 무엇입니까?입력 텍스트에서 변수로 데이터 가져 오기

다음은 HTML

<div class="row-fluid"> 
    <div class="span12" style="text-align:center"> 
     <form> 
      <fieldset> 
       <legend>Guessing Game</legend> 
       <label>Input a number in your mind</label> 
       <input type="text" id="userGuess" auto-complete="off"> 
       <span class="help-block" style="display:block"> 
        <p class="help-block" id="resultWaiting" style="display:block">Results!</p> 
        <p class="help-block" id="resultWarmer" style="display:none; color:#E61010">Warmer!</p> 
        <p class="help-block" id="resultColder" style="display:none; color:#104CE6">Brr! Colder</p> 
        <p class="help-block" id="resultCorrect" style="display:none; color:#E61010">YES! YOU GOT IT</p>  
       </span> 
       <button type="submit" id="submitButton" class="btn">Submit</button> 
       <button class="btn btn-danger" type="button">Show Result</button> 
      </fieldset> 
     </form> 
    </div> 
</div> 

입니다 그리고 여기

$("#submitButton").click(submit); 
function submit() { 
    var userInput = $('#userGuess').val(); 
    if (userInput == pcRandom) { 
     $("#resultWaiting").css("display","none"); 
     $("#resultCorrect").css("display","block"); 
    } else{ 
     compare(userInput, pcRandom); 
    } 
} 

자바 스크립트 코드를입니다 크롬 개발 도구에 디버깅하는 동안, 그것은 단지 UserInput 사용자가 변수가 정의되지 말했다.

나는 CSS 프레임 워크와 내가 jQuery를에 event.preventDefault()을 추가 한 후이 나를 위해 일한 jQuery를

+1

해야, 모범 사례는 필수적이지 않습니다. JavaScript는 내부적으로 이것을 구성합니다 : http://jsfiddle.net/uJDnd/ – Robert

+1

코드에 어떤 문제도 보이지 않습니다. 그 잘 작동 http://jsfiddle.net/amantur/CUDJR/ – TheVillageIdiot

+0

참고 : @ TheVillageIdiot는

태그를 꺼냈습니다. –

답변

1

에 대한 부트 스트랩을 사용합니다. 그러나이 compare 두 추측을 비교하고 그에 따라 CSS를 변경하고 pcRandom은 임의의 숫자를 선택합니다 것을 가정한다 :

$("#submitButton").click(function(event) { 
    event.preventDefault(); 
    submit(); 
}); 

function submit() { 
    var userInput = $('#userGuess').val(); 
    var pcRandom = 5; 
    console.log(userInput); 
    if (userInput == pcRandom) { 
     $("#resultWaiting").css("display","none"); 
     $("#resultCorrect").css("display","block"); 
    } else{ 
     compare(userInput, pcRandom); 
    } 
} 

편집 :

여기 완전히 기능 JSFiddle입니다 : http://jsfiddle.net/9VYvg/

관련 문제