使用JQuery最近的发布和评论系统

时间:2018-11-04 18:50:35

标签: php jquery

我有一个帖子和评论系统。诸如Facebook帖子和评论系统之类的东西。帖子可以正确显示,但评论仅显示在第一条帖子上,即顶部显示的帖子。能够对除第一篇文章以外的所有其他文章发表评论。 我需要您协助的问题如下: -每个帖子的评论应相应显示。 -为了能够对其他帖子发表评论。

这些是我所做的。 查看:

                <div class="box-footer" style="display: block;">
                    <form id="com" class="com" method="post">
                    <div class="img-push">
                        <input type="hidden"  class="status_id" id="status_id" name="status_id" value="<?php echo $post['spid']; ?>">

                        <textarea  name="comment" id="comment" class="form-control input-sm comment" placeholder="Press enter to post comment"></textarea>

                         <div class="box-footer box-form">
                          <btn class="btn btn-azure btn-sm pull-right commentbt" id="commentbt">Comment</btn>
                    <ul class="nav nav-pills">
                        <li><i class="fa fa-bullhorn"></i></li>

                    </ul>
                </div>
                    </div>
                  </form>
                    </div>
              <?php endforeach;?>

jQuery:

$(document).ready(function(){
$(".commentbt").click(function(){
        var comment = $(this).closest("div.img-push").find("input[name='comment']").val();
        alert(comment);

    });
});

所有得到的都是“未定义” 我需要获取输入字段和textarea的值。谢谢

1 个答案:

答案 0 :(得分:1)

最初,我可以注意到您代码中的下一个错误:

1)您忘记了div的结局<div class="box-footer" style="display:block;">

2)输入元素的属性namestatus_id,而不是comment

3)对多个元素使用相同的ID属性。

4)在JQuery上,我将通过按类别匹配来替换输入的搜索。另外,我也添加了对textarea值的搜索。

因此,请尝试下一个修改:

PHP

<?php foreach ($statuspost as $post): ?>
  <div class="box-footer" style="display:block;">
    <form class="com" method="post">
      <div class="img-push">

        <input type="hidden" class="status_id" name="status_id" value="<?php echo $post['spid'];?>">

        <textarea name="comment" class="form-control input-sm comment" placeholder="Press enter to post comment"></textarea>

        <div class="box-footer box-form">
          <btn class="btn btn-azure btn-sm pull-right commentbt">Comment</btn>
          <ul class="nav nav-pills">
            <li><i class="fa fa-bullhorn"></i></li>
          </ul>
        </div>

      </div>
    </form>
  </div>
<?php endforeach:?>

JQuery

$(document).ready(function()
{
    $(".commentbt").click(function()
    {
        var statusID = $(this).closest("div.img-push").find("input.status_id").val();
        alert(statusID);
        var comment = $(this).closest("div.img-push").find("textarea.comment").val();
        alert(comment);
    });
});