2

ユーザーが入力フィールドでEnter（Return）を押したときに送信したい（つまり、fire ajax）簡単なフォームがあります。送信ボタンを押すとイベントは正常に発生しますが、キーアップを使用してまったく同じ関数を発生させると、入力フィールドの値が空白になります。$（this）.val（）を使用して（keyup関数から）入力フィールドの値を渡そうとしましたが、渡されたパラメーターはまだ空白でした。

アップデートII：問題は初期ロードでのみ発生します。更新を押すと、意図したとおりにイベントが発生します。ChromeとFFでテスト済み。

http://jsfiddle.net/R5QsC/1/

// Value of #pin is blank in getKeyAjax()
$('#pin').keyup(function(e) {
    if (e.keyCode == 13) {
        console.log('DEBUG: Keypress detected (13)')
        getKeyAjax();
    }
});
// Value of #pin is correct in getKeyAjax()
$('#btnPwdCreate').click(function() {
    getKeyAjax();
});

function getKeyAjax() {
    console.log('DEBUG: Starting ... getKeyAjax()');
    var txtPin = $('#pin').val();
    console.log('DEBUG: Value of txtPin: ' + txtPin);
   .
   .
   .
}
4

2 に答える 2

1

私はあなたのフィドルでこれを引き起こしているかもしれない一つのことに気づきました。フォームフィールドを使用しているときに、「4桁のみ」というアラートが表示されることがありますが、通常は表示されません。formあなたのタグに問題があります。Enterキーを押すと、ブラウザーのデフォルトの動作（ajax以外のフォームの送信）がトリガーされます。実行する前にこれ$.GETが実行された場合、これは説明した動作と一致します。更新後、jsはキャッシュされ、送信と更新が発生する直前に$.getを許可してより速く評価される可能性があります。これは単なる理論ですが、最終的には2つの選択肢があります。

  1. <form>HTMLからタグを削除します。
  2. $('form').on('submit', function(e){e.preventDefault();});

1＃は、デフォルトの送信がないため、デフォルトの送信がないという効果があります<form>。2＃はonsubmitイベントをオーバーライドして、デフォルトの送信を防ぎます（フォームタグを保持できるようにします）。

これで問題が解決するかどうかに関係なく、スクリプトに必要です。フォーム内の入力でEnterキーを押しながらajaxを実行するための鍵になります。

http://jsfiddle.net/9TYhT/

上記のフィドル。動作は一貫しています。

于 2012-07-15T15:41:39.770 に答える
0

これを試して：

$(document).ready(function(){ // make sure DOM is ready to be manipulated
  // ...

    $('#pin').keyup(function(e) {
        if (e.which == 13) {
            getKeyAjax();
            e.preventDefault() // prevents form from being submitted
        }
    });

  // ...
})
于 2012-07-15T13:44:02.463 に答える