Question

我希望像facebook一样制作一个类似的柜台。我将使用消息ID从数据库加载各种帖子。我想制作（这里是“祈祷”）计数器，它应该使用jquery和ajax在页面后面。我无法获得特定的消息ID（中）。这里的代码是

jQuery：

$(document).ready(function () {
    $("div.pray").click( function()
    {
        var mid=$(this).val();
        $.ajax(
        {
            type:"POST",
            url:"increment.php",
            data:'mid='+mid,
            success:function ()
            {
                $("div.pray").text("Prayed");
            }
    });
});

PHP：

    session_start();
    if(isset($_SESSION['usrid']))
    {
        $usr = $_SESSION['usrid'];
        include('dbcon.php');
        $cot = "select * from posts where userid=$usr LIMIT 10";// order by eventDate        DESC, eventHour DESC" LIMIT0,10";
        $ex = mysql_query($cot,$con);

        while($cont=mysql_fetch_array($ex))
        {
            $date = date_create($cont['date']);
            $mid=$cont['mid'];
            echo "<div id='posts'>";
            echo $cont['message'];
            echo $photo;
            echo "<div class='pray'>"; 
            echo "<input type='hidden' class='mid' value='$mid'>"; 
            echo "<a href='#'>Pray</a></div>";
            echo "Prayed(".$cont['prayers'].")&nbsp;&nbsp&nbsp;&nbsp";
            echo date_format($date, 'd-m-Y H:i:s');
            echo "<hr>";
            echo "</div>";
        }
    }
    else
    {
        echo "Login to see";
    }
?>

我想只替换我点击祈祷的消息，并且还应该加载当前的祈祷次数。

Answer 1

将javascript AFTER 放到php script并检查。如果失败，请将.click()处理程序更改为

$(document).on('click', 'div.pray', function(){
    var mid=$(this).children('.mid').val();
    $.ajax(
    {
         type:"POST",
         url:"increment.php",
         data:'mid='+mid,
         success:function ()
         {
              $("div.pray").text("Prayed");
         }
    });

    //rest of your code
})

注意，我已经改变了第一行

var mid=$(this).val();

要

var mid=$(this).children('.mid').val();

正如，$(this)将选择div.pray而非input.mid元素。

Answer 2

在html代码中尝试这样的事情：

echo "<a href='increment.php?mid=$mid'>Pray</a></div>";

在javascript中：

$(document).on('click', 'div.pray', function(e){
   e.preventDefault();
   var $target = $(e.target).closest('a');
   $.ajax({
       type:"POST",
       url: $target.attr('href'),
       success:function (data){
          $target.closest("div.pray").html(data);
       }
  });
});

在ajax响应中，html代码应该进入div.pray

如何使用jquery构建类似的计数器？

2 个答案: