检测哪个按钮被按下

Question

我正在尝试使用jQuery检测哪个按钮被按下，然后根据结果在服务器端执行不同的操作。

jQuery很好用（虽然我可能用了一种冗长的方式），但是在我的代码中，无论我按哪个按钮，我都从php得到相同的响应："检测到添加按钮"。希望有人能告诉我出了什么问题？

jQuery代码：

$(document).ready(function() {
    $(".btn_add").on("click", function() { //If add btn pressed
        var id = this.id;
        var url = "process_ajax4.php?btn=" + this.id;

        var formdata = $('.myForm').serialize();
        $.post(url, formdata,
            function(data) {

                $("#results").html(data); //Response


            });
    });
    $(".btn_remove").on("click", function() { //If remove btn pressed
        var id = this.id;
        var url = "process_ajax4.php?btn=" + this.id;

        var formdata = $('.myForm').serialize();
        $.post(url, formdata,
            function(data) {

                $("#results").html(data); //Response

            });
    });

});

The Php

<?php
$btn=$_POST["btn"]; //Other posted variables removed for simplicity

if($btn="btn_add"){

    echo "<h1>Add button detected</h1>";
//Do stuff

}
elseif($btn="btn_remove"){

    echo "<h1>Remove button detected</h1>";
//Do other stuff
}
?>

HTML表单

<td>
    <form id=\ "myForm\" class=\ "myForm\" action=\ "\" method=\ "post\" enctype=\ "multipart/form-data\">
        <input type=\ "hidden\" name=\ "user_id\" value=". $collab_userid." />
        <input type=\ "hidden\" name=\ "id\" value=".$upload_id." />

        <button type=\ "submit\" id=\ "btn_remove\" class=\ "btn_remove\" name=\ "btn_remove\">Remove</button>
        <button type=\ "submit\" id=\ "btn_add\" class=\ "btn_add\" name=\ "btn_add\">Approve</button>
    </form>
</td>

- JulianJ

---

你正在使用 = 而不是 == 来比较字符串。 - Junius L

Answer 1

你需要将已按下的按钮添加到你的formdata中，否则点击操作将无法被检测到。

$(document).ready(function() {
    $(".btn_add").on("click", function() { //If add btn pressed
        var id = this.id;
        var url = "process_ajax4.php?btn=" + this.id;

        var formdata = $('.myForm').serialize();
        formdata += "&btn=btn_add"; // added the btn
        $.post(url, formdata,
            function(data) {

                $("#results").html(data); //Response


            });
    });
    $(".btn_remove").on("click", function() { //If remove btn pressed
        var id = this.id;
        var url = "process_ajax4.php?btn=" + this.id;

        var formdata = $('.myForm').serialize();
        formdata += "&btn=btn_remove"; // added the btn
        $.post(url, formdata,
            function(data) {

                $("#results").html(data); //Response

            });
    });

});

- Philipp

Answer 2

将php代码更改如下。

<?php
    $btn=$_POST["btn"]; //Other posted variables removed for simplicity

    if ($btn=="btn_add") {
       echo "<h1>Add button detected</h1>";
    //Do stuff
    } elseif ($btn=="btn_remove"){
       echo "<h1>Remove button detected</h1>";
    //Do other stuff
    }


 ?>

- Elby

Answer 3

你不需要为jquery按钮处理编写两个单独的函数。此外，由于你正在检测点击事件，因此可以从代码中删除。

$(document).ready(function() {
    $("button").on("click", function() { //If add btn pressed
        var id = this.id;
      
        var url = "process_ajax4.php?btn=" + this.id;
        console.log(url);
        var formdata = $('.myForm').serialize();
        $.post(url, formdata,
            function(data) {

                $("#results").html(data); //Response


            });
    });
  });
   

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<td>
    <form id="myForm" class="myForm" action="\" method= "post" enctype="multipart/form-data">
        <input type="hidden" name="user_id" value=". $collab_userid." />
        <input type="hidden" name="id" value=".$upload_id." />

        <button  type="submit" id="btn_remove" class="btn_remove" name= "btn_remove">Remove</button>
        <button  id="btn_add" class= "btn_add" name="btn_add">Approve</button>
    </form>
</td>

你可以使用 parse_url() 和 parse_str() 函数来获取 PHP 中的查询字符串。为了使用 $btn=$_POST["btn"];，必须将 tbn 属性作为表单数据传递，查询参数不会通过这种方法可用。

<?php
$parts = parse_url($url);
parse_str($parts['query'], $query);
$btn =  $query['btn'];

if($btn=="btn_add"){

    echo "<h1>Add button detected</h1>";
//Do stuff

}
elseif($btn=="btn_remove"){

    echo "<h1>Remove button detected</h1>";
//Do other stuff
}
?>

- Shubham Khatri

Answer 4

你的代码是有效的，只需添加 var url = process_ajax4.php 即可解决问题。在 PHP 中使用 == 而不是 = ，还要在按钮单击时添加 e.preventDefault（）以防止表单提交到 action ='url'。

$(document).ready(function() {
$(".btn_add").on("click", function(e) { //If add btn pressed
    e.preventDefault();
    var id = this.id;
    var url = "process_ajax4.php";

    var formdata = $('.myForm').serialize();
    formdata += "&btn=btn_add"; // added the btn
    $.post(url, formdata,
        function(data) {

            $("#results").html(data); //Response


        });
});
$(".btn_remove").on("click", function(e) { //If remove btn pressed
    e.preventDefault();
    var id = this.id;
    var url = "process_ajax4.php";

    var formdata = $('.myForm').serialize();
    formdata += "&btn=btn_remove"; // added the btn
    $.post(url, formdata,
        function(data) {

            $("#results").html(data); //Response

        });
  });

});

- Junius L

Answer 5

我认为你的代码看起来还不错。

在 PHP 中，你不能使用 = 来比较字符串，你可能需要将其更改为 strcmp(strA,strB)==0，以确保输入参数是添加按钮或删除按钮。

- SKLTFZ

Answer 6

实际上，您根本不需要jQuery代码。由于btn_remove和btn_add都是提交按钮，因此您可以使用以下方式检查哪个按钮用于提交表单：

if(isset($_POST["btn_remove"])) {
     //Remove button was pressed.
}

- Dramentiaras