jquery - 在 div 内显示表单 onclick

Question

感谢您的阅读。

我有评论列表，每个评论都有一个回复链接。当您单击链接时，应显示该单独评论的表单。

我很困惑。我写了这个 jquery，但我知道它根本没有意义。

  <script>
     $('.reply-comment').click(function(){

    var CommentID = $(this).attr('id');

    $(this).hide();
    $('.reply-comment-form').show( function(){
        $('.reply-comment-form-'+CommentID).html();
    });

    return false;
});
</script>

这是表格

    <div class="reply-comment-form well">';
     <form name="reply-form" id="reply-form" method="POST">
      <textarea name="Comment" rows="6" class="span10"></textarea> <br />
      <input type="submit" class="btn btn-primary replycommentsubmitbutton" value="Yanitla" />
     </form>
    </div> 

我在每个评论下添加了一个跨度以供表单显示

<div>
      comments text etc etc...
</div>
   <a href="" class="reply-comment" id="<?php $v['CommentID'] ?>"> Reply </a>
   <span id="reply-fomment-form-<?php $v['CommentsID'] ?>"></span>

那么，如何将 show() 函数与 html() 函数一起使用，或者还有其他方法吗？

你能帮我一下吗？谢谢。

Answer 1

例如，生成所有表单并隐藏这些表单

HTML:

<div>comments text etc etc...</div>
<a href="" class="reply-comment" id="<?php $v['CommentID'] ?>"> Reply </a>
<form class="reply-form">
    <input />
    <input type="submit" />
</form>
<br />
<div>comments text etc etc...</div>
<a href="" class="reply-comment" id="<?php $v['CommentID'] ?>"> Reply </a>
<form class="reply-form">
    <input />
    <input type="submit" />
</form>

CSS:

.reply-form{ display:none; }

JS:

$(function(){
    $('.reply-comment').on('click', function(e){
        e.preventDefault();
        $(this).next('.reply-form').show();
    });
});

DEMO. Updated Demo using OP's markup.