Question

首先，我是新形式并期待您的所有见解。

我的问题：我正在构建一个小网站，但我遇到了生成唯一HTML ID的问题。我通过PHP循环生成HTML，发送到一个聪明的模板。我承认，我的JavaScript能力不好，这就是为什么我无法解决这个问题...我想要的是在点击“添加评论”链接时在每篇文章下显示评论表单。

这是JavaScript -

<script>
    function show_cform() {
        o = document.getElementById("comment_link");
        if (o) { o.style.display = ""; }
        o = document.getElementById("comment_form");
        if (o) { o.style.display = "none"; }
    }   
</script>

重复几次的HTML -

<div id="comment_form">
    <!-- Article Content Here -->
    <a href="javascript:show_cform();">Add a Comment</a>
</div>

<div id="comment_link" style="display: none;">
    <form method="post" action="blog_comment.php">
        <input type="hidden" name="ID" value="{$id}">
        Your Name:<br />
        <input name="name" type="text" />
        <br /><br />
        Comment:<br />
        <textarea name="comment" rows="8" cols="40"></textarea>
        <br /><br />
        <input type="submit" value="Post comment">
    </form>
</div>

提前感谢您的帮助！

Answer 1

我会做这样的事情（正确）：

<script>
  function show_cform(formDiv) {
    // We pass the container into the function, so we can work out the rest
    var parts, idNum;
    // Get the number from the id
    parts = formDiv.id.split('_');
    idNum = parts[parts.length -1];
    // Change the display of the elements
    formDiv.style.display = "none";
    document.getElementById("comment_link_"+idNum).style.display = "block";
  }   
</script>

...和...

<?php

  // Presumably you are generating this in a loop. I don't know how
  // your loop currently works, but you just need an incrementing
  // id that is unique to each iteration, and put it onto the end
  // of the id's of the elements

  // For example
  for ($i = 0; ($someCondition); $i++) {

?>

<div id="comment_form_<?php echo $i; ?>">

    <!-- Article Content Here -->

        <a href="javascript:show_cform(this.parentNode);">Add a Comment</a>
        </div>
        <div id="comment_link_<?php echo $i; ?>" style="display: none;">

                <!-- etc etc -->

  <?php } ?>

实际上，这与我的工作完全不同 - 但是与你所拥有的一起工作就是我要做的事情。我没有时间详细解释我目前是如何处理它的，但是当我没有哭泣的婴儿来处理时，我可以编辑这个答案......

Answer 2

首先，我强烈建议使用jQuery或某种javascript抽象库。它会让你的生活更轻松。我假设您正在使用某种循环来抽出所有这些评论表单。我建议为你的id使用某种前缀或后缀，并在div id和你上面的href中设置它。在这种情况下，我只是使用前缀comment_link，后缀是一个整数，每次在循环中递增：

<a href="javascript:show_cform(comment_link1);">Add a Comment</a>
<div id="comment_link1" style="display: none;">

和你的职能：

function show_cform(theId) { .. }

通过PHP循环获得唯一的HTML ID

2 个答案: