1 
<%foreach (var commentitem in item.commentsModelList)
   {
        var containerId = "comment-" + commentitem.CommentId;%>
       <div id="commentContainer1">
       <div id="<%:containerId %>">
       <table border="0"  class="commentbox">

        <%var rid = "btnReply-" + commentitem.CommentId;
          var replyContainer = "container-" + commentitem.CommentId;%>
       <tr>

        <td> 
         <div id="<%:replyContainer %>">
          <input id="<%:rid %>" type="button" value="Reply" class="btnReply"/>
          </td>
       </tr>
    </table>
 </div>
</div>
  <%} %>

查询

     $(".commentbox .btnReply").live("click", function () {
            $(this).hide();
        var id = $(this).attr("id").split("-");
            alert(id);
            id.shift();
            alert(id);
            var newString = id.join('-');
            alert(newString);


            var $table = $('<table/>').addClass('tablecontent');
            $table.append(
                        $('<tr>').append($('<td>').append($input))
                             );

已编辑

            $($table).insertAfter("#container-" + newString).show();
        //     $("#container-" + newString).append($table);
        });

当单击一个 div 中的回复按钮时，会出现文本框，但是当单击另一个 div 中的回复按钮时，我希望前一个 div 中的文本框消失。我正在尝试复制此页面上的功能。

我创建了小提琴http://jsfiddle.net/rgmtF/16/

4

6 回答 6

3

为什么不在commentContainer级别引入一个新的css类来表示“selected”状态，即addClass（“selected”）。

当你点击回复

$(".commentbox .btnReply").live("click", function(){
  $('.commentContainer.selected').hide();  //hide previously selected comment divs if any
  $(this).parents('.commentContainer').addClass('selected');  //mark current as selected

  ...
};
于 2012-04-29T06:35:25.273 回答
2

更容易的是先创建回复区域，然后将这些节点移动到相应的区域。这将大大简化您的代码，并在您进行更改时更好地扩展。

上面的代码中提到了许多预先填充的 id，它们表示哪个注释是哪个。我认为使用这些 id 没有任何意义，因为这不是用于回复多条评论的东西。我的建议是让评论区字段保持静态，并使用隐藏字段来表示您要回复的评论。

您可以将其包装在一个不错的函数中，但原理仍然相同。

我创建了一个使用不同 HTML 的示例，但我认为以最简单的方式说明了这个想法。

http://jsfiddle.net/ubTDD/1/ （这个小提琴有大量文档）

于 2012-04-30T13:57:09.127 回答
0

如果您想在单击回复按钮时隐藏所有以前可见的文本框，只需在单击事件中添加一行代码即可。例如主容器 div id 是“master”

$("#master input[type=text]")​.hide();​

更好的是通过类名隐藏一个完整的元素块，包括文本框。

$(".tablecontent").hide();

示例代码看起来像

$(".commentbox .btnReply").live("click", function () {
      $(".tablecontent").hide();
      $(this).hide();
      ....
});
于 2012-04-25T18:56:10.930 回答
0

也许你可以通过以下方式解决这个问题：
1.给回复按钮的划分，一个名字。例如<input id="<%:rid %>" type="button" value="Reply" class="btnReply"/>
- 2.给你想要隐藏的文本区域的划分，一个类名。对于前 - “textarea”。

现在我将采用以下方式：

$(".commentbox .btnReply").live("click", function () {
      if ($('.textarea').is(':hidden')) {
         alert("Textarea is already hidden"); //check if already hidden
      } else {
         $('.textarea').hide();   //if not, then hide the textarea
      }
      ....
      ....
});
于 2012-04-28T23:00:12.653 回答
0

只需向所有文本框添加一个通用类名，或者使用一些 jquery 选择器来定位与页面上存在的回复按钮相关的所有文本框，然后使用通用类名或选择器首先隐藏所有文本框，然后再显示特定文本框与单击的回复按钮有关。

希望它能解决你的问题。

于 2012-04-30T11:37:49.053 回答
0 
$('your-button-selector').click(function(){
  $('your-textbox-selector').slideUp();
  //$('your-textbox-selector').slideToggle();//use this to toggle show and hide
});

或使用：

<input type="button" name="sample-button" onclick="hideTextbox('textbox-selector')"/>
function hideTextbox(selector){
  $(selector).hide();
  //$(selector).slideToggle();
}
于 2012-05-05T11:13:11.273 回答