Javascript 如何使用JQuery更新PHP查询以实时反映表单选择&；PHP

我有一个表单，它接受四个输入：

$query\u sort、$query\u time、$query\u date、$query\u rows

，所有内容都作为一个组合框，带有选项，除了作为文本框的

$query\u rows

在获取默认选中的输入后，PHP将处理该输入并放入一个查询中，该查询从MySQL数据库返回一个表（为了简洁起见，示例中未显示，但它确实成功返回了一个表）。问题是，由于我不想使用

submit

功能，或者希望页面刷新，并且希望能够添加一个文档侦听器来实时显示更改，因此如果我更改了

$query\u sort

变量，它将自动执行查询并返回一个表，而无需刷新或按下按钮

我已经能够让一个文档监听器工作了，但是没有更新。以下是我的JS代码：

$(function() {
   $('#query_sort').on('change', function(event) {
       var query_sort = $(this).val();

       if(query_sort) {
           request = $.ajax({
               type: "GET",
               url: "_php/nds/return_criteria_checkbox.php",
               data: {query_sort: query_sort}
           })
            .done(function(msg){
                console.log(msg);
           });
       }
    });
});

我选择的表格之一：

<select id = "query_sort" name = "query_sort">
    <option value = "time_desc" class = "query_sort_combobox_select"> Time Added (DESC)</option>
    <option value = "time_asec" class = "query_sort_combobox_select"> Time Added (ASEC)</option>
</select>

我可以确认PHP代码是有效的，因为我在

开关

的情况下将四个输入设置为默认值，这给了我符合默认条件的

$row[“title]

。我认为我的问题在于

请求=$.ajax

部分，因为这似乎根本不起作用

以防万一，以下是我的文件结构：

. admin (subdomain)
├── _php
|   ├── nds
|   |   └─ return_criteria_checkbox.php
├── nds
└   └─ nds.php

---

作为一个补充问题，我是否需要为我的

表单中的每个
输入
设置单独的
事件监听器
？或者我是否可以只引用
表单
，尽管里面有多个不同的
输入类型
？
鉴于我们的对话，您的php操作似乎正在响应，您的ajax请求是b发送成功，但问题似乎是您对ajax的理解有误。我相信您正在尝试使用ajax发送查询请求，获取表（我认为是部分html）并将其显示给用户。您可以这样做。
在html中添加一个具有唯一id的空div，我称之为TableContainer

$(function() {
   $('#query_sort').on('change', function(event) {
       var query_sort = $(this).val();

       if(query_sort) {
           $.ajax({
               type: "GET",
               url: "_php/nds/return_criteria_checkbox.php",
               data: {query_sort: query_sort}
           })
            .done(function(data, textStatus){
                //This is just to check that the server actually responded with some data, and not just an empty success code.
                if(textStatus !== "nocontent"){
                    $("#TableContainer").html(data);
                }
            });
       }
    });
});

现在要回答第二个问题，您只需向输入中添加一个唯一标识符（选择器）（无论是数据属性还是唯一类）并向其添加事件侦听器，您可能还需要将
数据
选项更改为
$（“selectorForForm”）.serialize（）

希望这就是您所寻找的。
您对ajax调用的响应做了什么？根本没有.done（）或.fail（）。@HimanshuPant我确实有一个
.done
段，如果ajax调用完成了，而不是ajax调用本身，它不会执行吗？不，成功（200-209）时会运行.done回调返回响应后，将数据参数传递给done回调，然后只执行console.log（数据）在您的回调中，并用打印的内容回击我。@HimanshuPant我在上面添加了它，它确实给了我一个日志。它说
XHR | GET*domain*/\u php/nds/return\u criteria\u checkbox.php？query\u sort=time\u asec
，但不更改显示。它不会更改显示，因为您告诉它要做的唯一事情就是写一个日志。如果您想更改页面内容您需要编写一些JavaScript代码才能做到这一点，但这不会改变任何东西；不幸的是，表保持不变。您是否在开发人员控制台中查看请求是否顺利通过，如果收到响应，请对其进行预览。您将在chrome中的devtools的网络部分看到它。如果我输入您r代码，它返回404，但是如果我用
.done
部分保留我的，它会给我一个200。虽然在Firefox上，响应选项卡上没有任何内容，但其他一切似乎都正常。我们有了它。`var request=$.ajax（{//code here}）`返回一个承诺，这就是.done（）回调是为。现在，我的代码是404。打开开发者工具。查看发出的请求，右键单击并在新选项卡上打开。检查url是否正确，因为这意味着提供给ajax的url没有返回任何内容，它可能不正确。出于某种原因，它现在确实给了我200分，可能是因为我做了一个输入错误之类的，但它不会刷新表格。firefox上的param选项卡会显示
query\u sort=time\u asec