2014-06-07 7 views
1

나는 JavaScript에 초보자이며 양식에 올바른 코드를 입력하고 '제출'버튼을 누르면 사용자를 다른 페이지로 안내하는 양식으로 웹 사이트를 구축 중입니다.JavaScript에서 가상 키보드의 '이동'버튼을 사용하려면 어떻게합니까?

현재 사용자는 페이지의 '제출'버튼을 클릭해야만 작동합니다. 즉, 태블릿이나 iPhone과 같은 기기의 가상 키보드에서 '이동'버튼을 사용할 수 없습니다. 사용자가 '제출'버튼을 클릭해야하는 대신 태블릿과 스마트 폰의 '이동'버튼을 사용할 수 있도록 사이트를 수정하고 싶습니다.

내 코드 :

버튼 :

<button class="btn btn-info btn-large span12" id="joe_btn" onclick="onSubmit()" touchstart="onSubmit()">Submit</button> 

자바 스크립트 그것을 실행 : 사용자가 '이동'버튼을 사용할 수 있도록

<script type="text/javascript"> 
     function onSubmit() { 
       if (document.getElementById('password').value == '03010213') {window.location.href = 'map.html'; } 
        else{ alert('Please check your passcode and try again');} 
         } 
    </script> 

가 어떻게 코드를 수정합니까 태블릿과 스마트 폰에서 어떻게 작동합니까?

모든 의견을 보내 주시면 감사하겠습니다. Javascript를 사용하는 완전한 초보자입니다. 사용하고자하는 답변에 정확한 수정 코드를 표시하십시오.

많은 감사,

답변

0

나는 표시하는 Go 버튼을 위해서는, 당신은 페이지에 input type="submit"이 필요하다고 생각합니다. 해당 버튼을 클릭 할 때 함수를 실행하고 false를 반환합니다. 실제 양식 제출은 스크립트가 다른 URL로 이동하기 때문에 진행되지 않습니다. 대답은 입력란이 대답과 피들에 표시된대로 form의 일부 여야합니다. 다음은 JSFiddle이 작동하는 모습입니다. http://jsfiddle.net/3TG6w/3/embedded/result - 휴대 기기에서이 항목을 찾으십시오.

<form method="post" action="home.html"> 
    <input type="password" id="password"/> 
    <input type="submit" class="btn btn-info btn-large span12" id="joe_btn" onclick="onSubmit(); return false;" touchstart="onSubmit(); return false;" value="Submit" /> 
</form> 


<script type="text/javascript"> 
    function onSubmit() { 
    if (document.getElementById('password').value == '03010213') {window.location.href = 'map.html'; 
    } 
    else{ 
     alert('Please check your passcode and try again'); 
    } 
    } 
</script> 
+0

나는 원래의 대답에서 약간 벗어났습니다. iOS 기기에서 JSFiddle을 확인하여 '이동'버튼과 코드가 예상대로 작동하는지 확인하십시오. –