Ajax在不刷新的情况下执行php-如何设置变量？

我有一个非常小的php脚本，其中有几个按钮，没有表单。当我按下一个按钮时，我希望根据我试图使用ajax发送的id执行一个小的php脚本

这些按钮如下所示：

<button onclick="deleteTask()" class="task" data-id="1">Task 1</button>
<button onclick="deleteTask()" class="task" data-id="2">Task 3</button>
<button onclick="deleteTask()" class="task" data-id="3">Task 4</button>
...

执行的PHP脚本只是一个测试：

$id = $_POST['id'];
echo "Response: " . $id;

结果是警报框的响应为：

Response: undefined

我想要的是获取作为响应按下的按钮的数据id。如果我用

data id=“1”

按下按钮

1

，我想在这个上下文中得到

“1”

的响应，

$（this）

是窗口对象

您可能会考虑在jQuery事件处理程序的后面使用

$（this）

。当您执行类似于

$（'#myElement'）的操作时，单击（function（）{…}），
$（此）
将表示已单击的元素

你为什么不能做这样的事

<button onclick="deleteTask(1)">Task 1</button>
<button onclick="deleteTask(3)">Task 3</button>

<script>
function deleteTask(id) {
    var dataString='id='+ id;

    ...
}
</script>

任务1
任务3
函数deleteTask（id）{
var dataString='id='+id；
...
}
正如@Andrew正确地说的，
$（this）
是窗口对象

因此，为了能够引用函数中的按钮对象，必须将其作为函数参数传递，例如在每个函数调用中作为
this
：

<script src="https://code.jquery.com/jquery-3.2.1.min.js" type="text/javascript"></script>

<script type="text/javascript">
    function deleteTask(button) {
        var id = $(button).data("id");

        $.ajax({
            type: "POST",
            url: "test.php",
            data: {
                'id': id
            },
            cache: false,
            success: function (html) {
                alert(html);
            }
        });
    }
</script>

<button type="button" id="button1" name="button1" onclick="deleteTask(this);" class="task" data-id="1">Task 1</button>
<button type="button" id="button2" name="button2" onclick="deleteTask(this);" class="task" data-id="2">Task 3</button>
<button type="button" id="button3" name="button3" onclick="deleteTask(this);" class="task" data-id="3">Task 4</button>


功能删除任务（按钮）{
变量id=$（按钮）。数据（“id”）；
$.ajax({
类型：“POST”，
url:“test.php”，
数据：{
“id”：id
},
cache:false，
成功：函数（html）{
警报（html）；
}
});
}
任务1
任务3
任务4
试试
数据：{'id'：id}
嘿，丹！谢谢，但它现在给出了一个未定义索引的通知：（不这样做的原因是我的知识有限：D非常感谢你！！！！！真糟糕
<script src="https://code.jquery.com/jquery-3.2.1.min.js" type="text/javascript"></script>

<script type="text/javascript">
    function deleteTask(button) {
        var id = $(button).data("id");

        $.ajax({
            type: "POST",
            url: "test.php",
            data: {
                'id': id
            },
            cache: false,
            success: function (html) {
                alert(html);
            }
        });
    }
</script>

<button type="button" id="button1" name="button1" onclick="deleteTask(this);" class="task" data-id="1">Task 1</button>
<button type="button" id="button2" name="button2" onclick="deleteTask(this);" class="task" data-id="2">Task 3</button>
<button type="button" id="button3" name="button3" onclick="deleteTask(this);" class="task" data-id="3">Task 4</button>