Question

在一个php文件中，我有一个带有大量输入的表单标签，这些输入的类型为Submit（因此基本上是按钮），它们是由外部php脚本自动创建的（因此它们的名称如button0，button1等）。我正在尝试使用Ajax和jQuery在单击时使用另一个php脚本将clicked按钮的值发送到数据库。

我是ajax的新手。我了解所用语法的方式是，您将编写如下内容：

$.post('phpScripts/whateverFile.php', {name: value}).done(function(data){//do something});

（以上内容将放在我正在谈论的“提交”按钮中的click事件的侦听器的回调函数中；是的，我确保使用e.preventDefault（））

例如，如果我有一个这样的按钮：

<input type = "Submit" name = "button0" value = "Button0"></input>

我可以使用以下方式将其发送给php文件处理：

$.post('phpScripts/whateverFile.php', {button0: $(this).val()}).done(function(data){//do something});

请记住，因为它是我附加到按钮本身的事件侦听器的一部分，所以我可以使用它来引用它（或者我知道）。

在php文件中，我可能会有这样的内容：

    if(isset($_POST['button0']))
    {
      //do whatever
    }

我的问题是：如何使用相同的事件侦听器为NUMEROUS提交按钮编写Ajax？也就是说，它们都具有相同的类，而我只是这样做：

$('.sameClass').click(function(e){//ajax function in here});

我目前的操作方式只有一个按钮。现在，我尝试通过将每个名称放入一个变量，然后将实际名称替换为这样的变量来使名称唯一：

var buttonName = $(this).attr('name');

$.post('phpScripts/whateverFile.php', {buttonName:$(this).val()}).done(function(data){console.log(data);});

但是那没有用，现在我无可救药了。关于如何执行此操作的任何想法？可能吗如何做到这一点，以便当我单击这些提交按钮中的每个按钮时，会基于该按钮发送一些唯一的数据？

非常感谢您的帮助...

Answer 1

将输入类型更改为button，并将类添加到每个html按钮。

$(function(){
$('input.myButton').click(function(e) {
    var button_value = $(this).val();
    $.ajax({
        url : 'whateverFile.php',
    type: 'post',
        data : {button_value:button_value},
        success: function(data) {
        //do something
        },
        error: function() {
        // do sometihing
        }
     });

并通过ajax调用提交数据，

Instantiate()

只需在服务器端通过var_dump（$ _ POST）进行验证。

Answer 2

为多个按钮设置if else块是不明智的。如果您有10个按钮，则必须制作10个if/ else块。效率真的很低。

我的解决方案是-为按钮分配相同的类。

<button class="my_btn" name="button1" value="1">1</button>
<button class="my_btn" name="button2" value="2">2</button>
<button class="my_btn" name="button3" value="3">3</button>

然后在ajax调用中传递按钮的值和名称：

$(".my_btn").click(function(){
    const btn_val = $(this).val(); //gets the value of the current clicked button
    const btn_name = $(this).attr('name');

    $.ajax({
        url 'phpScripts/whateverFile.php',
        method: 'POST',
        data: {btn_val, btn_name},
        success: function(data) {
            console.log(data);
        },
        error: function(data) {
            console.log(data)
        }
    })

});

在服务器端/ php中，只有一个if块。这样，您就可以知道单击按钮后是否有帖子数据，还知道它来自哪个按钮。

if (isset($_POST["btn_val"])) {
    echo $_POST["btn_val"] . "is from btn name: " . $_POST["btn_name"];
}

是否可以为多个输入设置单个Ajax调用？

2 个答案: