Question

我想在PHP中生成一个包含动态内容的HTML表，并在每行的单元格上添加一个onclick事件，以根据该行触发操作。

如何实现？

这是我的例子：我有一个表从数据库打印数据。表由3列组成。第1列和第2列包含姓名和第3列，第3列引用注释。第三栏说“评论存在”或“无评论”，取决于是否存在相关评论。

目标是在用户点击第三列时弹出一个小窗口，以显示给定的评论。

以下是一个表的示例，以及到目前为止我尝试过的内容：

<table border=1>
   <tr>
      <th>ID</th>
      <th>Vardas</th>
      <th></th>
   </tr>
<?php while($row = mysql_fetch_array($res)) : ?>
   <tr>
      <td><?php echo $row['id'] ?></td>
      <td><?php echo $row['vardas'] ?></td>
      <td><?php echo $row['gedimas'] ?></td>
   </tr>
<?php endwhile; ?>
</table>

如何为$row['gedimas']行添加点击事件，以显示数据库中的完整评论？

Answer 1

您可以直接在PHP中放置“onclick”事件：

<td <?php echo "onclick='displayComment(".$id.")'" ?> >

关于打开窗口的一般结构，你可以很容易地构建表格，然后有另一个页面用于显示评论。

表格代码：

<table>
  <tr>
    <th>Name</th>
    <th>Surname</th>
    <th>Has comment ?</th>
  </tr>
<?php
for( $i = 0; $i<count($database_data); $i++){
   $item = $database_data[$i];
   ?><tr>
       <td><?php echo $item[0] ?></td>
       <td><?php echo $item[1] ?></td>
       <td <?php 
          echo "onclick='displayComment("
          echo $item[0].", ".$item[1]
          echo ")'"?>
       ><?php echo $item[2] ? "Comment exists" : "No comments" ?></td>
     </tr>
}

然后你需要包含一个带有以下代码的javascript文件：

function displayComment(name, surname) {
   window.open(
      "display_comment.php?name="+encodeURI(name)+"&surname="+encodeURI(surname),
      "_blank",
      "height=200, width=300"
}

最后，你需要你的display_comment.php页面，其实质是：

// get comment from database using data in $_GET["name"] and $_GET["surname"]

Comment from <?php echo $_GET["name"]." ".$_GET["surname"] ?> : 
<br>
<?php echo $comment_retrieved_from_database ?>

替代

另一种方法是仅在HTML代码中记录注释的ID，然后在javascript中添加onclick事件。

单元格的php代码如下：

<td <?php echo "data-comment-id='$id'" ?> >

你可以用javascript的方式添加onclick事件：

var tableCells = document.querySelectorAll("td[data-comment-id]");
for(var i=0; i<tableCells.length; i++){
   var cell = tableCells[i];
   var commentId = cell.getAttribute("data-comment-id");
   cell.addEventListener("click", function(){openPopup(commentId);});
}

在php生成的表格单元格上添加onclick事件

1 个答案:

替代