ajax 在发布后从另一个页面检索数据


ajax to retrieve data from another page after post

我知道这很容易,但我只知道这段代码的 DOM 等效物。 很长的那个。 我已经在堆栈中搜索了一些问题,但我似乎找不到解决方案。

所以基本上我有这个脚本:

function searchNow(str)
{
    $.ajax({
    url: "search.php",
    type: "POST",
    async: false,
    data:  {"search": str},
    success: function(data){
            alert("test");
            $("#result").html(data);
        }
    });
}
<table>
<tr>
    <td>Search: </td>
    <td><input type = "text" name = "search" onBlur="searchNow(this.value)">      </td>
</tr>

这将提交搜索到搜索.php以执行查询搜索并检索结果并将其显示在 ID 结果中。

我可以使用旧的 DOM ajax 轻松做到这一点,但后来我想尝试使用这个 jquery 版本,因为它更干净,也许更快。

在我的搜索中.php我有这个:

$search = $_POST['search'];
return $search;

可悲的是,我似乎根本无法返回任何东西。

一些输入将不胜感激,我已经开始熟悉jQuery Ajax,但只在同一页面上,而不是在页面间操作上。

谢谢-魔术师

你的 PHP 文件应该输出这个值。ajax将阅读该页面并获取其内容。

$search = $_POST['search'];
echo $search;

你想做echo $search而不是return

您还可以添加print_r($_POST);以查看PHP方面发生的事情。

一旦你看到它在做什么,你就可以进一步开发你的php脚本。

// Sets the correct response type
header('Content-type: application/json');
// get your search string/query
$search = $_POST['search'];
/*
 * Do whatever you need in order to get a result
 */
echo json_encode($result);
exit;

如果要将搜索查询传递到数据库,请务必阅读Nettuts对PDO的精彩介绍。有很多常见的陷阱可能导致安全问题/漏洞利用 - 避免其中一个主要陷阱(SQL注入)在该帖子中介绍。

根据您的评论,请确保您带有搜索字段的页面在正确的位置正确包含 jquery(对不起,如果这很明显,我并不是要光顾!

<html>
<head>
    <title>Jquery Ajax</title>
    <!-- google nicely host jquery for free... -->
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
</head>
<body>
    <script type="text/javascript">
    function searchNow(str)
    {
        $.ajax({
            url: "search.php",
            type: "POST",
            data:  { "search": str },
            success: function(data) {
                alert("test");
                $("#result").html(data);
            }
        });
    }
    </script>
    <table>
        <tr>
            <td>Search: </td>
            <td><input type="text" name="search" onBlur="searchNow(this.value)" /></td>
        </tr>
    </table>
    <div id="results"></div>
</body>
</html>
不要忘记

创建一个ID="result"的HTML元素,由选择器使用,以包含搜索.php打印的结果。

$("#result").html(data);

你的 PHP 文件应该输出这个值。ajax将阅读该页面并获取其内容。

$search = $_POST['search'];
echo $search;

此外,成功选项将在 jQuery 的未来版本中被弃用。你应该像这样使用 .done(callbackFunction):

    $.ajax({
      url: 'beh.php',
      type: 'POST',
      data: {search: "beeeeeeeh"}
    }).done(function () {
      // do stuff
    })

另外,有什么特别的原因将异步设置为 false 吗?

我尝试使用

type: 'GET'

并在 PHP 文件中,获取的值为

$search = $_GET['search'];
echo $search;

成功了。希望它也对你有用。