2014-09-02 2 views
0

사용자가 내 REST 스크립트를 사용하여 사용자를 인증하기 위해 로그인 버튼을 누를 때 AJAX 요청을 보내려고하는 코드바 프로젝트에 페이지가 있습니다. 기이 한 일은 AJAX 코드를 준비 함수에 넣으면 작동하지만 이벤트 처리기에 넣으면 상태 코드가 404가됩니다. 지금 당장 가지고있는 코드는 다음과 같습니다.

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
     <meta charset="utf-8" /> 
     <meta name="format-detection" content="telephone=no" /> 

     <!-- Set the viewport settings to prevent scaling --> 
     <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, target-densitydpi=device-dpi" /> 

     <!-- Makes your prototype chrome-less once bookmarked to your phone's home screen --> 
     <meta name="apple-mobile-web-app-capable" content="yes"> 
     <meta name="apple-mobile-web-app-status-bar-style" content="black"> 

     <title>Login</title> 
     <link rel="stylesheet" type="text/css" href="css/index.css" /> 
     <link rel="stylesheet" href="css/ratchet.css"> 
     <meta name="msapplication-tap-highlight" content="no" /> 
     <script src="js/jquery-2.1.1.min.js"></script> 
     <script> 
      $(document).bind("mobileinit", function(){ 
       $.support.cors = true; 
       $.mobile.allowCrossDomainPages = true; 
      }); 
     </script> 
     <script type="text/javascript" src="cordova.js"></script> 
     <script type="text/javascript" src="js/index.js"></script> 
     <script src="js/ratchet.js"></script> 
     <script type="text/javascript"> 

      app.initialize(); 

      function auth(username, password){ 
       $.getJSON("http://devserver/REST.php?callback=?", {method: "mobileAuthUser", username: username, password: password}, function(response, status, xhr){ 
        alert(response); 
       }).error(function(xhr, ajaxOptions, thrownError){ 
        alert("error"); 
        alert(xhr.status); 
        alert(thrownError); 
       }); 
      } 

      $(function(){ 
       auth("username", "password"); 
       $("#subButton").click(function(){ 
        auth("username", "password"); 
       }); 
      }); 
     </script> 
     <style> 
      /*Stops the text from being in all caps*/ 
      body * { 
       text-transform: none;  
      } 
     </style> 
    </head> 
    <body> 
     <header class="bar bar-nav"> 
      <h1 class="title">Login</h1> 
     </header> 
     <div class="content"> 
      <form> 
       <input type="text" id="username" placeholder="username"> 
       <input type="password" id="password" placeholder="password"> 
       <button class="btn btn-positive btn-block" id="subButton">Login</button> 
      </form> 
     </div> 
     <div id="deviceready"> 
      <p class="event listening">Connecting to Device</p> 
      <p class="event received">Device is Ready</p> 
     </div> 
    </body> 
</html> 

초점 조각은 여기

auth("username", "password"); 
$("#subButton").click(function(){ 
    auth("username", "password"); 
} 

페이지가 잘 준비 작업 때 바로 실행 년대 auth()입니다. 버튼을 클릭했을 때 실행되는 auth()은 대신 오류가 발생하고 오류 콜백에서 404 오류 코드를 제공합니다. 이해할 수없는 것은 정확히 동일한 함수 호출이 실패했기 때문입니다. 이벤트 핸들러.

답변

0
$("#subButton").on('touchend', function(){ 
    auth("username", "password"); 
}); 

click 이벤트 대신.

관련 문제