Question

我正在尝试创建一个社交媒体网站。在第四行中，onclick='func_cmnt_open(".$row['post_ID'].")应显示每个条目唯一的div。这似乎是一个语法错误，但如果它在PHP或javascript中，我无法缩小它。

在第6行中，id属性设置为comment".$row['post_ID']."，以使每个div与while循环迭代唯一。

if (mysqli_num_rows($result) > 0) {
    while($row = mysqli_fetch_assoc($result)) {
        echo "<h4>".$row["username"]." said ".$row["cm_text"]." at ".$row["time"]." comment".$row['post_ID']."</h4>";
        echo "<button class='w3-button w3-teal w3-xlarge' onclick='func_cmnt_open(".$row['post_ID'].")'>&#9776;</button>";
        echo "<button class='w3-button w3-teal w3-xlarge' onclick='func_like()' id='like'>&#9776;</button>";
        echo "<div class='w3-black' id='comment".$row['post_ID']."' style='display: none'>";
        echo "  <div class='w3-container''>";
        echo "  <h4>";
        echo "      ///code was here    ";
        echo "  </h4>";
        echo "  <button class='w3-button w3-grey w3-xlarge' onclick='document.getElementById('id02').style.display='block''>&#9776;</button>";
        echo "      <div id='id02' class='w3-modal'>";
        echo "          <div class='w3-modal-content w3-card-4'>";
        echo "              <header class='w3-container w3-teal'> ";
        echo "              <span onclick='document.getElementById('id02').style.display='none'' class='w3-button w3-display-topright'>&times;</span>";
        echo "              ///code was here";
        echo "              </header>";
        echo "                  <div class='w3-container'>";
        echo "                      <form class='w3-container' action='home.php' method='GET'>";
        echo "                      <p><input type='text' class='w3-input' name='post_comment' placeholder='Whats happening there...'/></p>";
        echo "                      <p><button class='w3-button w3-black'>Post</button></p>";
        echo "                      </form>";
        echo "                  </div>";
        echo "                  <footer class='w3-container w3-teal'>";
        echo "                  <p>nothing here</p>";
        echo "                  </footer>";
        echo "          </div>";
        echo "      </div>";
        echo "  </div>";
        echo "</div>";
    }
    }

JAVASCRIPT：我曾尝试使用string concat加入＆＃34;评论＆＃34;和＆＃34; num＆＃34;获得div的唯一ID。这也没用。

function func_cmnt_open(num) {

if (document.getElementById('comment'+num.tostring()).style.display == "none")
{
    document.getElementById('comment'+num.tostring()).style.width = "100%";
    document.getElementById('comment'+num.tostring()).style.display = "block";
}
else
{
    document.getElementById('comment'+num.tostring()).style.width = "0%";
    document.getElementById('comment'+num.tostring()).style.display = "none";
}
}

OUTPUT：the selected button should invoke the javascript with arguments from PHP code and display a black div where i can enter comments

我不确定这是最有效的方法。如果还有其他方法可以达到相同的输出，请提供建议。

Answer 1

如果post_ID不是严格意义上的字符串，则会在Javascript中出现语法错误。

 ... onclick='func_cmnt_open(".$row['post_ID'].")'...

考虑这个值1上面将在页面源代码中创建它。

 ... onclick='func_cmnt_open(1)'...

现在考虑此值post1

... onclick='func_cmnt_open(post1)'...

在第二种情况下它应该是

... onclick='func_cmnt_open("$row['post_ID']")'...

要使用echo的方式在PHP中获取它，您必须转义双引号或属性中的'也会导致问题。像这样：

 ... onclick='func_cmnt_open(\"".$row['post_ID']."\")'...

还有一些其他引用问题onclick='document.getElementById('id02').style.display='block'' ..>，我不知道我是否已经完成所有问题，但应该更好。

if (mysqli_num_rows($result) > 0) {
    while($row = mysqli_fetch_assoc($result)) {
        echo "<h4>{$row["username"]} said {$row["cm_text"]} at {$row["time"]} comment{$row['post_ID']}</h4>
            <button class='w3-button w3-teal w3-xlarge' onclick='func_cmnt_open(\"{$row['post_ID']}\")'>&#9776;</button>
            <button class='w3-button w3-teal w3-xlarge' onclick='func_like()' id='like'>&#9776;</button>
            <div class='w3-black' id='comment{$row['post_ID']}' style='display: none'>
              <div class='w3-container''>
              <h4>
                  ///code was here    
              </h4>
              <button class='w3-button w3-grey w3-xlarge' onclick='document.getElementById(\"id02\").style.display=\"block\"'>&#9776;</button>
                  <div id='id02' class='w3-modal'>
                      <div class='w3-modal-content w3-card-4'>
                          <header class='w3-container w3-teal'> 
                          <span onclick='document.getElementById(\"id02\").style.display=\"none\"' class='w3-button w3-display-topright'>&times;</span>
                          ///code was here
                          </header>
                              <div class='w3-container'>
                                  <form class='w3-container' action='home.php' method='GET'>
                                  <p><input type='text' class='w3-input' name='post_comment' placeholder='Whats happening there...'/></p>
                                  <p><button class='w3-button w3-black'>Post</button></p>
                                  </form>
                              </div>
                              <footer class='w3-container w3-teal'>
                              <p>nothing here</p>
                              </footer>
                      </div>
                  </div>
              </div>
            </div>";
    }
}

通过PHP将MySQL数据作为字符串传递给javascript

1 个答案: