Question

我正在尝试将一个javascript变量传递给PHP，以便我可以创建一个（MySQL）查询来返回单个记录。用户将输入一个搜索字符串，但会返回许多记录包含匹配的字符串。然后，用户将选择他们想要查看的单个记录。

这是我的HTML（recipe_summary.php）：

<head>
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
    <script type="text/javascript" src="script.js"></script>      
</head>
<body>
<table>
   <tr>
       <th>Recipe ID</th>
       <th>Title</th>
       <th>Ingredients</th>
       <th>Recipe</th>
    </tr>
    <?php foreach($search_results as $result) { ?>
    <tr>
        <td><a href="#" name="<?php echo $result['recipe_id']; ?>"><?php echo $result['recipe_id']; ?></a></td>
        <td><?php echo $result['title']; ?></td>
        <td><?php echo $result['ingredients']; ?></td>
        <td><?php echo $result['recipe']; ?></td>
    </tr>
    <?php }; ?>
</table>
</body>

这是我的js（script.js）：

$(document).ready(function () {
        var myText;

        $("a").click(function(){
            myText = $(this).text();
            ajax_post(myText);
        });

        function ajax_post(myText){
            var hr = new XMLHttpRequest();
            var url = "recipe_result.php";
            var passedVal = myText;
            var myVal = "recipe_id=" + myText;

            hr.open("POST", url, true);
            hr.setRequestHeader("Content_type","application/x-www-form-urlencoded");
            hr.onreadystatechange = function () {
                if(hr.readyState == 4 && hr.status == 200) {
                    var return_data = hr.responseText;
                    document.getElementById("status").innerHTML = return_data;
                }
            }
            hr.send(myVal);
        };    
});

这是recipe_result.php：

<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Untitled Document</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script> 
    <script type="text/javascript" src="script.js"></script>   
</head>
<body>
    <?php 
        if(isset($_POST['recipe_id'])){
            echo "SET";
        } else {
            echo "NOT SET";
        }

    ?>
    <div id="status"></div>

</body>
</html>

用户将单击一个锚标记（recipe_summary.php），该标记将触发将存储recipe_ID的script.js上的click事件（这是我迷路的地方）并将其传递给ajax_post（）。从这里我试图将存储的变量作为php变量发送到'recipe_result.php'，然后我将在MySQL中使用它来仅返回所选记录。

在recipe_result.php $ _POST ['recipe_id']没有设置，所以我不确定我的错误在哪里。

我不熟悉ajax但是从我读过的内容看来，ajax似乎是解决方案。我看了很多教程（ajax_post（）中的所有内容都来自我试图遵循的教程）但通常它们以HTML表单开头，然后将结果写入同一页面。

Answer 1

你的代码看起来很好，只需在php中阅读recipe_id

echo $_POST['recipe_id'];

还要查看$_POST变量documentation

如何使用onclick事件将Javascript变量传递给PHP

1 个答案: