Question

在一个项目中，我有一个用户流，每个人都可以共享和评论共享。我即时为每个共享添加评论。整体结构如下：
enter image description here

我最近听说使用ID编号并不是一个好主意，因为它们在CSS中不受支持。如果我把它改成一个类我有一个新问题：我无法识别哪个帖子被点击了（如果ID不是数字那么我将无法获得该特定的共享ID）。

我在jQuery中的代码如下所示：

$("div.comment").click(function(){ // Add comment link
            var jusid = $(this).attr('id');
            var content = "<textarea name='txtcomment' class='txtcomment' cols='67' rows='7'></textarea><button name='btncomment' class='btncomment'>Submit</button><div class='closecomment'>Close</div>";
            $("div#after"+jusid).html(content);
            $("div#after"+jusid).find('.txtcomment').focus();
        });

它实际上是纠结的，我相信在不久的将来它会变得一团糟。做这个的最好方式是什么？如何没有ID号码，而且还能识别哪个div有点击的ID号？（我们需要为该特定份额添加该评论）

Answer 1

您可以将帖子的ID放在帖子中的一个隐藏字段中。通过这种方式，您可以在点击帖子时检索帖子的ID。

[编辑]

假设您有一个html结构，如：

<div class='comment'>
  <input type='hidden' class='post_id' value='1'/>
</div>
<div class='comment'>
  <input type='hidden' class='post_id' value='2'/>
</div>
<div class='comment'>
  <input type='hidden' class='post_id' value='3'/>
</div>

你可以使用你的jQuery：

$("div.comment").click(function(){
          var clicked_post_id = $(this).find('input.post_id').val();

          // Perform other operations with the above retrieved clicked_post_id

});

http://jsfiddle.net/7wCJK/2/

的演示

Answer 2

如果我理解你是正确的，那么你就不需要id了。

示例html：

<div>
    <h3>#1333</h3>
    <p>Lorem ipsum</p>
    <a class="comment" data-postid="1333">Add a comment</a>
</div>

示例Java脚本：

$("a.comment").click(function() {
    var $this = $(this),
        isOpen = !$this.next().length,
        $textarea;

    if (!isOpen) {
        $this.next().focus();
        return;
    }

    $textarea = $("<textarea/>");

    $this.after(
        $textarea
            .after(
                $("<button/>")
                    .text("Submit")
                    .click(
                        {$textarea: $textarea, postId: $this.attr("data-postid")},
                        submitComment
                    )
            )
            .after(
                $("<button/>")
                    .text("Close")
                    .click(/* maybe do something here? */)
            )
    );

    $textarea.focus();
});

submitComment = function (event) {
    var message = event.data.$textarea.val(),
        postId = parseInt(event.data.postId, 10);

    alert("Do something with these:\nComment: " + message + "\nPost Id: " + postId);
};

这会在点击的评论链接后添加textarea和两个buttons（并专注于textarea）。

品味风格：）

这是fiddle给你的。（修订版）

如何组织用户的共享以轻松地向该特定帖子添加评论？

2 个答案: