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);
});

HTML代碼

<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);
});