使用 ajax 获取 data-id 并将其传递给同一页面中的 php



我想用ajax获取data-id并将其传递给同一页面中的php,但是当我单击按钮并想回显$_POST["postid"]时,什么也没发生。有什么错误吗?我想获取帖子ID。请帮助我,我是 Ajax 和 PHP 的新手。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <!-- Bootstrap css -->
    <!-- Fontawesome -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.css">
</head>
<body>
    <button title="Reply" class="replyButton btn p-0 pr-1" name="reply" data-id="11"><i class="fas fa-reply"></i></button>
    <div id="mydiv">
    <?php
        if(isset($_POST["postid"])){
            echo $_POST["postid"];
        }
    ?>
    </div>
</body>
</html>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js">
</script>
<script src="http://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49"
crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js" integrity="sha384-smHYKdLADwkXOn1EmN1qk/HfnUcbVRZyYmZ4qpPea6sjB/pTJ0euyQp0Mk8ck+5T"
crossorigin="anonymous"></script>
<script>
    $(document).ready(function(){
        $('.replyButton').on('click', function(){
            var postid = $(this).data('id');
            $post = $(this);
            $.ajax({
                url: 'test.php',
                type: 'post',
                data: {
                    'postid': postid
                },
                success: function(data){
                    $("#mydiv").html(data);
                }
            });
        });
    });
</script>

jQuery 中的选择器不正确。任一更改

<div class="mydiv">  <!-- selector .mydiv -->

自:

<div id="mydiv">  <!-- selector #mydiv -->

或者代替$("#mydiv")改用$(".mydiv")

而且由于您发布到同一个 php 文件,因此当文件收到帖子时,您应该只输出所需的值,即 echo $_POST["postid"];,jQuery代码将接收并放置在div中。

注意: 考虑将 PHP 代码调整为:

<?php
    if(isset($_POST["postid"])){
        echo $_POST["postid"];
    } else {
?>
    <!-- Page content goes HERE -->
<?php } ?>

最新更新