Question

我正在使用jQuery AJAX进行投票系统。单击div（投票时），数据将发送到中间文件（在本例中为up_vote.php），然后使用新数据更新div。它完美地工作，给出结果= 2（变量加一）。

在第二阶段，我尝试在另一个div（页面的另一个站点中为#results）中显示投票结果。问题是，它刷新div，但结果不正确，显示1而不是2（看起来变量尚未发送，或者div在接收结果之前刷新）。

我留下完整的代码以防任何人想要尝试...

的index.html

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />   
<link type="text/css" rel="stylesheet" href="style.css" />
<script type="text/javascript" src="myjquery.js"></script>
</head>
<body>
    <script type="text/javascript">
        $(function(){
            $(".n_vote").click(function() {
                var id_field = $(this).attr("id");
                var parent = $(this);

                $.ajax({
                    type: "POST",
                    url: "up_vote.php",
                    data: {
                        id_field: id_field, 
                        name: name
                    },
                    cache: false,
                    success: function(html) {
                        //Show the results in the same div
                        parent.html(html); 
                        //Show the results in another div, #results
                        $("#results").load("up_vote.php"); 
                    }  
                });
                return false;
            });
        });
    </script>

    <div class="vote_system">
        <div class="n_vote" name="up" id="1">Clic here to show the result</div>
    </div>
    <!-- Correct result=2 -->
    ______________________________

    <br>
    Show the result in a another div: 
    <br>
    <div class="results" id="results">
    </div>
    <!--  Incorrect result=1 -->
</body>
</html>

up_vote.php

<?php
    $id_field = $_POST['id_field'];
    echo 'Result=';
    echo $id_field + 1;
?>

有经验的人可以向我解释为什么第二个div没有显示正确的结果吗？会发生什么，我该如何解决？

Answer 1

而不是使用加载up_vote.php的$("#results").load("up_vote.php");（显然将$ id_field传递为未设置和清空，因为你通过get和no参数加载url）所以你得到1而不是2是正常的。
你必须使用从服务器返回的相同成功html在第二个div中显示它，如$("#results").html(html);

使用jQuery AJAX的投票系统

1 个答案: