javascript - 回复评论 YouTube 风格

Question

我正在尝试创建一个与 YouTube 类似的评论系统。textarea单击按钮时，在评论下显示回复的最简单方法是什么？我认为没有必要为每个评论复制textarea并制作它。display:none

带文本区域

<div class="comment">
  <p>Bla bla</p>
  <a hred="" id="reply">Reply</a>
  <textarea class="reply"></textarea>   
</div>

没有文本区域

<div class="comment">
  <p>Bla bla2</p>
  <a hred="" id="reply">Reply</a>
</div>

jQuery

$('#reply').click(function(){

}

Answer 1

就像是

$('#reply').click(function(){
  $(this).parent().append($('<textarea>').attr('class','reply'));
});

应该做的工作。

Answer 2

取决于@user1419007 的回答。

它已经测试您是否已经在评论下有一个文本区域。如果是这种情况，它将被发送。

$('.reply').click(function(){
    if($(this).parent().find('textarea').length < 1) {
        $(this).parent().append($('<textarea>').attr('class','reply'));
    } else {
        alert('Sending: ' + $(this).parent().find('textarea').val());
    }
});​

这是一个关于JSFiddle的例子

Answer 3

ID 应该是唯一的，所以你不应该有多个#replys. 相反，您可以为每个添加一个类。

<div class="comment">
  <p>Bla bla</p>
  <a hred="" class="reply-button">Reply</a>
</div>

$('.reply-button').click(function(){
  $(this).after($('<textarea>').attr('class','reply-box'));
});