javascript - AJAX：无法让我的 ajax $.post 请求工作

Question

拥有将数组发布到 PHP 脚本的简单代码。问题是没有数据发送到服务器端。问题是什么？

JS代码

// Ajax call for sending song wish
var wishName = $('#wish-name').val();
var wishEmail = $('#wish-email').val();
var wishSong = $('.wish-input input').val();
var postData = {name: wishName, email: wishEmail, song: wishSong};

function postSongSuccess(data) {
    if(data == 1) {
        console.log(data);
    }
    else if(data == 0) {
        console.log(data);
    }
}

$('#send-song').click( function() {
   $.post("./wp-content/plugins/wish-song/wishSong.php", postData, postSongSuccess);
   alert(wishName);
   console.log(postData);
});

代码

<div class="wish-input-half">
    <label>Ditt för- och efternamn</label>
    <input id="wish-name" type="text">
</div>
<div class="wish-input-half">
    <label>Din e-postadress</label>
    <input id="wish-email" type="text">
</div>
<div class="clearfix"></div>
<div class="wish-input">
    <label>Skriv artist och låttitel</label>
    <input id="wish-song" type="text">
</div>
<div class="wish-input-submit">
    <input id="send-song" type="submit">
</div>

Answer 1

看起来var wishName = $('#wish-name').val();是在页面加载时执行的，不一定是在用户更改/提供值时执行的。

当用户想要发送数据时，您必须读取这些值，而不是事先。

function postSongSuccess(data) {
    if(data == 1) {
        console.log(data);
    }
    else if(data == 0) {
        console.log(data);
    }
}

$('#send-song').click( function() {
   $.post("./wp-content/plugins/wish-song/wishSong.php", {
        name: $('#wish-name').val(),
       // ...
   }, postSongSuccess);
});