javascript - 如何使 onclick 在第一次点击时起作用？

Question

我正在为 myFunction() 使用 onclick，该函数在按下“回复”按钮时执行。

该函数用于为其子级(注释)设置parentId 值。我的问题是，直到用户第二次单击该按钮后才设置该值。

如果我按下回复按钮一次，parentId 将为 0，如果我在添加评论之前单击它两次，它将获得其父 ID。

获取评论，包括带有父 ID 的隐藏输入字段

$query2 = "SELECT * FROM data WHERE `parent_id` IS NULL ORDER BY `id` DESC";
            $result = mysqli_query($connect, $query2);

            while($row = mysqli_fetch_array($result)){
                $id = $row['id'];
                $name = $row['name'];
                $comment = $row['comment'];
                $date = $row['date'];
                $parent_id = $row['parent_id'];

                                printf("<div>");
                                    printf("<div>");
                                        printf("<div>");
                                            printf("<strong> $name </strong><span style='float:right'class='text-muted'>$date + $id</span>");
                                        printf("</div>");
  printf("<div>%s",$comment);
                                            printf("<div class='cmt'>");
                                                printf("<button class='replybtn' onclick='return myFunction(%d);' style='float:right'>Reply</button>",$id);
                                                printf("<div class='cmttext'></div>");
                                                printf("<div class='replyform'></div>");
                                            printf("</div>");
                                        printf("</div>");
                                    printf("</div>");
                                printf("</div>");

我的功能

var myFunction = function(parentId){
        document.getElementById('plopp').value = parentId;
    };

回复表单

var varHtml = "\
    </br><form method='post' name='form_child'>\n\
    Namn: <br>\n\
    <input type='text' name ='name_child'><br>\n\
    Kommentar: <br>\n\
    <textarea name='comment_child'></textarea> \n\
    <input type='hidden' name='parent_child' id='plopp'><br>\n\
    <input type='submit' name='submit_reply' value='Skicka'/> \n\
    <button id='hide' type='submit' name='close'>Stäng</input>\n\
    </form>";

    var allElements = document.body.getElementsByClassName("replybtn");

    var addCommentField = function() {
      for (var i = 0; allElements.length > i; i++) {
        if (allElements[i] === this) {
          console.log("this "+ i);

          if (document.getElementsByClassName("replyform")[i].innerHTML.length === 0) {
            document.getElementsByClassName("replyform")[i].innerHTML = varHtml;
          }

        }
      }
    };


    for (var i = 0; i < allElements.length; i++) {
      allElements[i].addEventListener('click', addCommentField, false);
    }

存储评论

if(isset($_POST['submit_reply'])){
            if(isset($_POST['name_child']) && isset($_POST['comment_child'])){
                if(!empty($_POST['name_child']) && !empty($_POST['comment_child'])){
                    $name = htmlentities($_POST['name_child']);
                    $comment = htmlentities($_POST['comment_child']);
                    $parent_id = $_POST['parent_child'];
                    $date = date("Y-m-d");
                    $connect = mysqli_connect(...);

                    if($connect){
                        mysqli_select_db($connect, "comments");
                        $query_child = "INSERT INTO data (...) VALUES (...)";

                        if(mysqli_query($connect, $query_child)){

                        } else {
                            die ("Failed: " . mysqli_error($connect));
                        }
                    } else {
                        die("Failed to connect to mysql: " . mysqli_errno($connect));
                    }
                }else{
                    echo "";
                }
            }
        //}
}

Answer 1

将return false添加到事件处理程序而不是函数:

onclick='myFunction(%d); return false;'

这里的onclick是事件处理程序。即使您将 return false 放入 myFunction 中，它也会失败，因为返回的 false 永远不会被事件处理程序捕获。

另外，为了让它吸引人，你可以尝试使用:

onclick='return myFunction(%d);'

并在函数内添加return false。