javascript - 将文本输入变量传递给 PHP 以进行 Div 加载

Question

我有一个网页，我想在其中有一个输入框和一个搜索按钮。它将搜索与输入框匹配的电影。搜索和解析是通过 php 完成的，但我希望结果以更新的 div 形式呈现在原始页面上。我有当前的 html 代码:

<script type="text/javascript">
    function goSearch(){
        $("#Moviesearchdiv").load("MovieSearch.php");
     }
</script>

<form action="JavaScript:goSearch()" method="POST">
    <input type="text" name="moviename">
    <input type="submit" name="submit" value="Search" >
</form>

<div id="Moviesearchdiv"></div>

我的 MovieSearch.php 看起来像这样:

<?php
$themovie = $_POST["moviename"];
$myurl = "http://my-url-here.com/search/?q={$themovie}";

    $response = file_get_contents($myurl);
    $result = json_decode($response, true);
    $result=$result['movies'];

    $totality = count($result);

    for ($i = 0; $i <$totality; $i++) {
        $mymovietitle = $result[$i]['original_title'];
        $myposter = $result[$i]['poster_original'];
        echo "<li><img src={$myposter} >{$mymovietitle}</li>";
    }
?>

当我按原样运行它时......什么也没有发生。如果我手动更改 MovieSearch.php 中的第一个变量以读取如下内容:

$themovie = "Rocky";

这将按预期正确加载我的 div 中的所有《洛基》电影，而无需刷新页面。

如何正确地将“moviename”输入传递给 php？

非常感谢任何帮助和建议。

谢谢

埃尔南多

Answer 1

a) 您没有将数据传递到页面(.load 中的第二个参数应该是您的表单数据)，因此 $themovie 的值为 null。

b) 即使表单上有 method="POST"，使用 .load 也会假定 GET，除非提供的数据是对象。提供表单数据并以对象格式(以 POST 形式发送)的一种方法是:

function goSearch(){
   $("#Moviesearchdiv").load("MovieSearch.php",$('#yourFormId').serialize());
}

请注意，您需要向表单添加一个 ID，并将 #yourFormId 替换为它。

在调试这些类型的 AJAX 调用时，首先您需要知道您尝试通信的页面位于 AJAX 调用认为它所在的位置。您知道这是因为当您填写 $themovie - 您会得到结果，您也可以在浏览器的开发人员工具中检查这一点。

其次，您需要确保发送的数据是您认为的数据，您可以通过返回 $_POST 或 $_GET 的 print_r() 或 var_dump() 来检查这一点，具体取决于您使用的内容(或认为您的数据)在本例中使用类似)。

这 2 个步骤将帮助您解决所发现的大部分问题。