无法获取使用 PHP 创建的 DIV 的 ID

Question

我有一个用户仪表板页面，每次他们访问它时，它都会根据会话电子邮件将他们所有的个人时间提取到数据库中。它构建了所有项目的列表供他们查看。我希望他们能够单击其中一项，然后将其定向到使用 div id 或值作为 MySQL 搜索参数的搜索页面。问题是我无法获得 div id.. 或 value... 或类。当我尝试提醒（this.id）时，它显示为空白。如果我提醒（this.className），则为未定义。

这是我的代码：

function getAllMyItems_itemsTable2(string $email){
    include 'config.php';
    $sql = 'SELECT * FROM itemsTable WHERE email= :email';
    $stmt = $conn->prepare($sql);       
    $stmt->bindParam(':email', $email, PDO::PARAM_STR);
    $stmt->execute();
    $getResults = $stmt->fetchAll();
    echo '<div class="w3-card w3-white" style="width: 60%; margin: 0 auto; padding: 10px;">';
    echo '<div class="row" style="text-align: left;">';
    echo '<div class="col-md-3" style="border-bottom: solid 1px gray;">Item Name</div><hr>';
    echo '<div class="col-md-3" style="border-bottom: solid 1px gray;">Added Time</div><hr>';
    echo '<div class="col-md-3" style="border-bottom: solid 1px gray;">Pieces</div><hr>';
    echo '<div class="col-md-3" style="border-bottom: solid 1px gray;">Description</div><hr>';
    echo '</div>';
    echo '<div class="row" style="text-align: left;">';
    foreach( $getResults as $row) {
        echo '<div class="col-md-3" id="'.$row['itemName'].'" value="'.$row['itemName'].'"><a href="#">'.$row['itemName'].'</a></div>';
        echo '<div class="col-md-3">'.$row['addedTime'].'</div>';
        echo '<div class="col-md-3">'.$row['pieces'].'</div>';
        echo '<div class="col-md-3">'.$row['description'].'</div>';
    }
    echo "</div>";     
}

我希望能够单击 div id = $row['itemName'] 并获取该名称并将其传递到下一页以执行搜索。有没有更好的方法来解决这个问题？

HTML 部分：

<div class="resultsContainer" style="text-align: center;">
    <?php
 if(!getNumberOfItems_itemsTable($email) == 0){
        echo getAllMyItems_itemsTable2($email);
        }
        ?>
    </div>


<script>

  $('.resultsContainer').click(function(){
  alert(this.id);
  });

    </script>

Answer 1

您只是在整个容器上放置了一个点击事件。不是您实际点击的内容。所以这只是指容器......

由于您在具有唯一 ID 的 div 上没有不同的类，因此很难为这些 div 设置点击事件。您可能想在 div 上添加一个带有 id 的类。然后，您可以更改事件处理程序以专门响应这些事件。

一个例子：

echo '<div class="col-md-3 actionable" id="'.$row['itemName'].'" value=.....';
                         //^^^^^^^^^^

然后：

$('div.actionable').on('click',function(){
 //^^^^^^^^^^^^^^
    alert( $(this).attr('id') );
});

请注意，我更改了 id 的引用，使其更像 jquery，因为您在 jquery 中。最好保持一致；）