如何在While循环中使用php变量创建JavaScript变量？

Question

我正在使用来自MySQL数据库的信息来建立网络，我希望在单击按钮后出现图片。

              echo "<img align=\"left\"src=\"".$path[$y]."\" alt=\"error\">";
              echo "<img align=\"right\"src=\"".$path_edit[$y]."\" alt=\"error\" id=\"$id[$y]\" style=\"visibility:hidden\">";

              echo "_____________________________________";
              echo "<script type=\"text/javascript\">";
                echo "function showImage() {
                  document.getElementById(\"$id[$y]\").style.visibility=\"visible\";
                }";
              echo "</script>";
              echo "<br><br>";
              echo "<input type=\"button\" onclick=\"showImage();\" value=\"Show Picture\"/>";
              echo "<p>";

我希望第二个图像（带有$ PATH_edit [$ y]的图像）在单击其按钮后出现。 （按钮在每两张图像后出现）。我拥有echo的全部内容，因为它们全都在循环中，并且我希望它们全部显示为数据库具有的入口数。我知道我无法在Javascript中使用php变量，我尝试了所有操作，但无法修复。我是php，html的新手，也不了解JavaScript。

This is how it looks like without clicking the buttom我知道我可以在图像上添加一个id，但这仅适用于第一个。This is how it looks like after clicking我也尝试过这个：

echo "function showImage() {
                      var id_id =  \"$id[$y]\";
                      document.getElementById(id_id).style.visibility=\"visible\";
}";

这就是我现在的样子：

                echo "<center>";
            echo "<img align=\"left\"src=\"".$path[$y]."\" alt=\"error\">";
            echo "<img align=\"right\"src=\"".$path_edit[$y]."\" alt=\"error\" id=\"$id[$y]\" style=\"visibility:hidden\">";
            echo "_____________________________________";
            echo "<br><br>";
            echo '<input type="button" onclick="showImage('.$id[$y].');" value="Show Picture"/>';
            echo "<p>";
                print $comentario[$y];
            echo "</p>";
            echo "</center>";
            $y++;
          }
        }
        else {
        print "Database NOT Found ";
        }
        mysqli_close($db_handle);
        ?>
        <script type=\"text/javascript\">
        function showImage(id) {
          document.getElementById("#"+id).style.visibility="visible";
        }
        </script>";

先谢谢您。

Answer 1

首先是一些建议，分别使用php，javascript和html。在一起很难阅读和维护。否则，您将在循环的每一遍创建一个函数。没有任何事情像那样让我感到困扰。像这样尝试：

将图像的ID作为参数发送给函数。 单个功能，将在循环之后。

function showImage(id) {
  document.getElementById(id).style.visibility="visible";
}

并且在循环的每个通道中，将图像的ID像这样发送给函数：

<input type="button" onclick="showImage(\"$id[$y]\");" value="Show Picture">

最后它将给出类似的内容：

<?php
    while(...){
       echo '<img align="left" src="'.$path[$y].'" alt="error">';
       echo '<img align="right" src="'.$path_edit[$y].'" alt="error" id="'.$id[$y].'" style="visibility:hidden">';
       echo '_____________________________________';
       echo '<br><br>';
       echo '<input type="button" onclick="showImage('.$id[$y].');" value="Show Picture">';
       echo '<p>';
    }
?>

<script type="text/javascript">
    function showImage(id) {
       document.getElementById(id).style.visibility="visible";
    }
</script>

在显示html时，

使用'进行回显，而不使用“进行显示，这更实用。祝你好运