通過Ajax傳遞單擊的提交按鈕值

Question

我在wordpress中工作，我有一個html表單，其中包含兩個提交按鈕，它們具有相同的類名和不同的值。 我通過ajax傳遞了提交按鈕單擊的值，並將其顯示在屏幕上。 現在我的問題是只有第一個提交按鈕的值會通過，而第二個提交按鈕的值永遠不會顯示在屏幕上。 請指導和下面是我的代碼。

碼

<form id="mydispimage" action="" method="post">
    <select id="category" style="width: 250px; background-color: lightgrey;" name="category">
        <option disabled="disabled" selected="selected" value="">Select category</option>
        <option value="Cutie Pie">Cutie Pie</option>
        <option value="Chubby">Chubby</option>
        <option value="Dimples">Dimples</option>
    </select>
    <input class="displayimage" name="displayimage" type="submit" value="star1" />
    <input class="displayimage" name="displayimage" type="submit" value="star2" />
</form>

jQuery查詢

jQuery(function ($) {
    $(".displayimage").click(function (e) { //form is intercepted
        e.preventDefault();
        //show timer
        jQuery("#timer").css("display", "block");
        jQuery("#participate").css("display", "block");
        var vote = jQuery(".displayimage").val();
        alert(vote);

        //$("#timer").show(slow);
        //serialize the form which contains secretcode
        // var sentdata = $(this).serializeArray();
        //var vote = 1;
        //Add the additional param to the data        
        var sentdata = ({

            action: 'displaymyimage',
            foo: vote
        })

        //set sentdata as the data to be sent
        $.post(yes.ajaxurl, sentdata, function (res) { //start of funciton
            //$("#myresult").append(res.l);
            //alert(res);
            $("#myresult").html(res);
            //$.parseJSON(data);
            return false;
        } //end of function
        ,
        'json'); //set the dataType as json, so you will get the parsed data in the callback
    });  // submit end here

});

Answer 1

改變這個

 var vote= jQuery(".displayimage").val();

對此

 var vote= jQuery(this).val();

您需要使用$(this) 。 否則，您將始終在匹配的.displayimage類中將第一個值帶入元素。 這就是為什么您總是看到第一個按鈕的值的原因。