jQuery - 单击链接/按钮时显示文本框

Question

我正在尝试为每个评论添加一个回复按钮，以便当有人点击按钮（例如“回复”）时，会自动显示一个文本框，用户可以在其中填写表单。

到目前为止，我做的并不多......

PHP

<div id='replycomment' class='reply' onclick='jsReply($comment_id);'>Reply</div>
<div id='showreply'></div>

的jQuery

function jsReply(comment_id) {
    var form = '<form id="showReplyForm" action"add_reply.php" method="post">';
    form += '<textarea name="replybody" cols="35" rows="2" maxlength="299"</textarea>';
    form += '<input type="hidden" name="replybodyId" value="' + comment_id + '" />'
    form += '<input type="submit" name="replysubmit" value="Reply"/></form>';
    jQuery('#replybody').replaceWith(form); }

任何人都可以帮助我吗？非常感谢。 我有点困惑我需要将id从jquery链接到php ...

谢谢

Answer 1

要使代码正常工作，请执行以下操作：http://jsfiddle.net/MaqLQ/1/

在头脑中：

var jsReply = function(comment_id) {
    var form = '<form id="showReplyForm" action"add_reply.php" method="post">';
    form += '<textarea name="replybody" cols="35" rows="2" maxlength="299"></textarea>';
    form += '<input type="hidden" name="replybodyId" value="' + comment_id + '" />';
    form += '<input type="submit" name="replysubmit" value="Reply"/></form>';
    jQuery('#showreply').replaceWith(form);
}

你在一个表格连接结尾处错过了一个半连胜。你正在查看'replyBody'，而不是你的html中存在的'showreply'，而如果你的代码不是全局的，你的html就不会为onclick定义。您还缺少开口textarea标签的结束角括号。

另外，我不知道你的上下文，我不在这里进行代码审查，但在其他一些事情中...你应该真的避免在你的html元素中使用onclick。

Answer 2

我建议使用jQuery库。

通过CSS #showreply隐藏display: none;并将HTML表单放入其中。

$('#replycomment').click(function() {
    $('#showreply').show();
});

我还建议您将ID更改为类，因为您将有多个实例。

Answer 3

<强> PHP

<div class='reply'>Reply</div>
<form action='add_reply.php' method='POST' class='reply-form'>
  <textarea name='replybody'></textarea>
  <input type='hidden' name='comment_id' value='<?php echo $comment_id; ?>' />
  <input type='submit' value='Reply' />
</form>

<强> CSS

.reply-form {
  display: none;
}

<强>的Javascript

$(".reply").click(function() {
  $(this).siblings(".reply-form").show();
  $(this).hide();
});