php - jQuery/php/mysql - 如何在不重新加载页面的情况下操作 mysqli_query？

Question

我有一个表，其中包含通过 PHP 从 MySQL 数据库读取的数据。第一列包含所有项目名称。现在，单击表格第一列中的 td 元素将链接到一个页面，其中包含有关 td 中包含的项目的更多详细信息。

现在我想到了以下想法:

$(document).ready(function() {
    $('#table td:first-child').click(function() {
        $('div.main').animate({
            height: "50px"
        }, 600);
        setTimeout(function() {
            $('div.data').fadeIn(1000);
        }, 600);
    });
});

div.main 是包含表格的 div 容器。我现在想做的是向上滑动该容器并淡化一个新的 div-容器，就在它的正下方，新容器包含()一个包含动态查询的 PHP 页面(伪代码，无字符串转义，简化版):

SELECT detail FROM items WHERE items.name = $_GET['name'];

我想不通的是，我是否以及如何告诉 PHP 文件，它包含在正在淡出的 div 容器中，它必须从数据库中获取项目名称的详细信息。

现在我可以通过 JavaScript/jQuery 读取项目名称，但我想不出一种无需重新加载页面即可将该值传递给 PHP 文件的方法。

欢迎提出任何想法或建议!

Answer 1

我想你要找的是 asynchronous JavaScript and XML (AJAX) .这听起来很吓人，但幸运的是 jQuery 使它变得非常简单。

您可以调用$.ajax()直接，但在大多数情况下，您可以使用其中一种便利包装器。在这种情况下，我认为 $.load()将满足您的需求。

那么，假设您的 PHP 文件名为 detail_ajax.php，它返回您希望放入 div 中的 HTML(类为 data)。那么您所要做的就是:

$('div.data').load( '/detail_ajax.php', function(data){
    $(this).html(data);
});

如果你想传递数据到detail_ajax.php，你可以这样传递:

$('div.data').load( '/detail_ajax.php', { 'someField' : 'someValue' },
    function(data) {
        $(this).html(data);
    }
});

在 detail_ajax.php 中，如果您检查 $_POST['someField']，您将看到传入的值。