2

AJAX 呼び出しを正しく取得できないようです。関数を扱う他の QA がありました$.ajax()が、私はこれを解決しようとしてい$.post()ます。

フォーム ボタンがクリックされると、先頭にある JavaScript が実行されます$.post()。URL/loginがルーティングされ、loginPost関数に渡されます。そこで応答が決定され、javascript に送り返されます (そうですか?)。代わりに、Web ページが応答をレンダリングします (合格 || 失敗)。

AJAX 呼び出しからの応答が返されて処理されないのはなぜですか?

これは、expressJS と jQuery で AJAX がどのように機能するかをよく理解するために私が取り組んでいる簡単な例です。どんな助けでも大歓迎です!

--ビュー/login.jade

script(src='/_js/jquery-1.8.2.min.js')
script
  $(document).ready(function(req, res) {
    $('#login').submit(function() {
    var formData = $(this).serialize();
    console.log(formData);
    $.post('/login', formdata, processData).error('ouch');

    function processData(data, status) {
      console.log(status);
      console.log(data);
      if (data == 'pass') {
        $('#content').html('<p>You have successfully loggin in!</p>');
      } else {
        if (! $('#fail').length) {
          $('#formFrame').prepend('<p id="fail">Incorrect login information. Please try again)</p>');
        }
      }
    } //end processData
  }); //end submit
}); //end ready

div.main
h1= title
div#formFrame
  form(id='login', action='/login', method='POST')
p
  label(for='username') Username:
  input(id='username', type='text', name='username')
p
  label(for='password') Password:
  input(id='password', type='password', name='password')
p
  input(id='button', type='submit', name='button', value='Submit')

--ルート/index.js

app.post('/login', loginPost);

--ルート/loginPost

module.exports.loginPost = function(req, res) {
    var password = 'admin'
      , username = 'user'
      , data = req.body;

    if (data.username == username && data.password == password) {
      res.send('pass');
    } else {
      res.send('fail');
    }
};
4

1 に答える 1

9

それでも、デフォルトのアクションを介して送信を停止する必要があります。これは、次の<form>コマンドで実行できますevent.preventDefault()

$('#login').submit(function(evt) {
  evt.preventDefault();
  // ...
});

それ以外の場合、<form>はページをそのページにリダイレクトしaction(または、指定されていない場合は現在のアドレスに戻りaction)、$.post要求を中断します。

于 2012-09-28T19:17:48.177 に答える