AJAX 양식 요청이 Express 웹 서버에 전송되지 않았습니다.

Question

Expressjs, Twitter Bootstrap 및 BackBonejs에 대해 배우기 시작했습니다. 커맨드 라인 도구로 기본 Expressjs 앱을 만들고 로그인 양식에 index.html을 추가했습니다. 사용자가 이벤트를 첨부 한 "로그인"버튼을 클릭하면 양식 정보를 검색하고 '/ 로그인'경로로 아약스를 호출하지만 작동하지 않습니다.

필요한 파일 :

• index.html
• login.js
• server.js
• routes.js

도움 주셔서 감사합니다.

Answer 1

문제는 그 기본 bahavior 그리고 그것은이에 지시되지 않았기 때문에 폼이 여전히 리디렉션을 통해 제출된다는 점이다 그렇지 않으면합니다. 그리고 리디렉션 때문에 브라우저가 Ajax 요청을 중단합니다.

리디렉션을 방지하기 위해, 당신은 <form>의 .submit() event에 결합하여 사용할 수 있습니다 event.preventDefault() :

$(document).ready(function() { 
    $('#login-form').submit(function (e) { 
     e.preventDefault(); 
    }); 
}); 

또한의 .click()보다는 Ajax 용이 이벤트를 사용하는 것이 바람직합니다 <button> 많은 브라우저 (예를 들어, 초점이 <input type="text">에있을 때 이를 Enter 키를 눌러) 단지 type="submit" 버튼을 클릭 이외의 다른 행동을 통해 제출 허용 :

$(document).ready(function() { 
    $('#login-form').submit(function (e) { 
     e.preventDefault(); 

     var _login = $('#login').val(), 
      _password = CryptoJS.SHA512($('#password').val()), 
      _remember = $('input:checkbox:checked').val() ? 1 : 0; 

     // etc. 
    }); 
}); 

Answer 2

하나를 들어, 버튼을 클릭에서 기본 동작을 방지해야합니다

$('#btn-login').click(function() { 
    // ... 
}); 

// should accept the passed event and `prevenDefault`, like... 

$('#btn-login').click(function (e) { 
    e.preventDefault(); 
    // ... 
});