Question

拜托，你能告诉我这段代码有什么问题吗？这是Django framework + JS。

当我点击按钮时，我想让div块可见。

其他一切都很好。我的意思是我的循环没问题，comment.id返回一个唯一的ID。

当我点击按钮时，我有一个JS错误：＆＃34;构造函数不能被调用为函数＆＃34;

Uncaught TypeError: Failed to construct 'Comment': Please use the 'new' operator, this DOM object constructor cannot be called as a function.
    at HTMLButtonElement.onclick ((index):218)
onclick @ (index):218
(index):218 Uncaught TypeError: Failed to construct 'Comment': Please use the 'new' operator, this DOM object constructor cannot be called as a function.
    at HTMLButtonElement.onclick ((index):218)
onclick @ (index):218

我的代码：

  <!-- Button see comments -->
  <button 
    onclick="Comment()" 
    type="button" 
    class="w3-button w3-theme-d1 w3-margin-bottom">
    Commenter
  </button>
  <!-- end button -->

  {%for comment in comments%}

    {%if comment.articles.id == post.id or comment.statut.id == post.id %}   

      <!-- Bloc comments-->
      <div id="{{comment.id}}" style="overflow-wrap: break-word; display: none;" class="w3-container w3-card-2 w3-white w3-round w3-margin">    
        <p>{{comment.text}}</p>
          <p style="width: 100%; text-align: right;">
            <img alt="Avatar" class="w3-circle-articles" style="vertical-align:middle;" src="{{media}}{{comment.author.profile.avatar}}" />
            <span style="color: #0477BF;"">{{comment.author}}</span> le {{comment.date|date:"d F"}} à {{comment.date|date:"H:m"}}
         </p>                           
      </div> 
      <!-- End bloc comments -->

      <!-- JAVASCRIPT to see comments  -->
      <script type="text/javascript">
        function Comment{{comment.id}}() {
            document.getElementById("{{comment.id}}").style.display = "block";
        }

      </script> 
      <!-- End JAVASCRIPT -->

    {%endif%} 

  {%endfor%}

当我查看页面的源代码时，这就是HTML中的样子：

    <div id="2" style="overflow-wrap: break-word; display: ;" class="w3-container w3-card-2 w3-white w3-round w3-margin">    
                    <p>lol</p>
                      <p style="width: 100%; text-align: right;">
                        <img alt="Avatar" class="w3-circle-articles" style="vertical-align:middle;" src="http://******/media/user/user_20/avatar/horror-gaming-avatar.png">
                        <span style="color: #0477BF;" "="">Preyor</span> le 10 juillet à 10:07
                     </p>                           
     </div>

<script type="text/javascript">
                function Comment2() {
                    document.getElementById("2").style.display = "block";
                }

                i = i+1
                document.getElementById("Comment_Count3").innerHTML = i;
 </script>

    <div id="3" style="overflow-wrap: break-word; display: ;" class="w3-container w3-card-2 w3-white w3-round w3-margin">    
                    <p>hihi</p>
                      <p style="width: 100%; text-align: right;">
                        <img alt="Avatar" class="w3-circle-articles" style="vertical-align:middle;" src="http://*********/media/user/user_4/avatar/hebus_1920x1080_1464110916_5053_sMlLt6u.jpg">
                        <span style="color: #0477BF;" "="">GrandGTO</span> le 18 juillet à 02:07
                     </p>                           
     </div>

    <script type="text/javascript">
                    function Comment3() {
                        document.getElementById("3").style.display = "block";
                    }

                    i = i+1
                    document.getElementById("Comment_Count3").innerHTML = i;
     </script>

Answer 1

问题是Comment()功能未定义。 Javascript引擎无法找到Comment()的定义。Comment2()，Comment3()有定义。但没有Comment()的定义。

function Comment{{comment.id}}() { // it should be Comment and not Comment{{comment.id}}
        document.getElementById("{{comment.id}}").style.display = "block";
    }

Javascript - 构造函数不能作为函数调用

1 个答案: