javascript - alert（）が空なのはなぜですか？

Question

入力フォームとボタンを含むHTMLがあります。

<input id="nameField" type="text">
<input id="submitBtn" type="button" value="Submit">

そしてスクリプト：

$(function() {
    var name = $('#nameField').val();

    var data = {
        name: name
    }

    $('#submitBtn').click(function() {
        alert(data.name);
    });
});

フィールドにテキストを入力してボタンをクリックします。ただし、アラートは空であり、コンソールにエラーはありません。

Answer 1

dataこれは、ユーザーがテキストを入力するずっと前に、ドキュメントの準備ができたらすぐに初期化するためです。

出来るよ ：

$(function() {
    $('#submitBtn').click(function() {
       var name = $('#nameField').val();
       var data = {
          name: name
       };
       alert(data.name);
    });
});

Answer 2

$(function() {
$('#submitBtn').click(function() {
var name = $('#nameField').val();

var data = {
    name: name
}
    alert(data.name);

});

}）;

ページが読み込まれたときではなく、ノードをクリックしたときのフィールドの現在の値が必要です。「data」オブジェクトをグローバル（window.data）変数として宣言し、「click」関数で「name」値を変更するだけです。