如何实现MySQL数据数组的可点击效果？附当前数据表展示代码

Alright, based on your existing PHP code that renders a MySQL data table, let's add clickable features—here are the most practical scenarios you might need, with code you can drop right in:

1. Click Entire Row to Jump to a Detail Page #

If you want users to click any part of the row to view full record details (like a dedicated detail page), add an onclick event to the <tr> tag and pass the record's ID as a parameter.

Here's the modified code:

<?php 
$no = 1; 
$total = 0; 
while ($row = mysqli_fetch_array($query)) { 
    $category = $row['category'] == 0 ? '' : number_format($row['category']);
    // Add click event and pointer cursor to the row
    echo '<tr onclick="window.location.href=\'detail.php?id='.$row['id'].'\'" style="cursor: pointer;"> 
            <td>'.$no.'</td> 
            <td>'.$row['id'].'</td> 
            <td>'.$row['url'].'</td> 
            <td>'. $row['code'] . '</td> 
            <td>'.$category.'</td> 
          </tr>'; 
    $total++;
    $no++;
} 
?>

Note: Replace detail.php with your actual detail page path. The cursor: pointer style makes it obvious the row is interactive.

2. Make Specific Fields Clickable (e.g., URL, ID) #

If you only want certain columns (like the record ID or URL) to be clickable, wrap those values directly in <a> tags:

Example: Turn URL into a new-tab link + ID into a detail page link #

<?php 
$no = 1; 
$total = 0; 
while ($row = mysqli_fetch_array($query)) { 
    $category = $row['category'] == 0 ? '' : number_format($row['category']);
    // Wrap URL in a link that opens in a new tab
    $clickableUrl = '<a href="'.$row['url'].'" target="_blank">'.$row['url'].'</a>';
    // Wrap ID in a link to the detail page
    $clickableId = '<a href="detail.php?id='.$row['id'].'">'.$row['id'].'</a>';
    
    echo '<tr> 
            <td>'.$no.'</td> 
            <td>'.$clickableId.'</td> 
            <td>'.$clickableUrl.'</td> 
            <td>'. $row['code'] . '</td> 
            <td>'.$category.'</td> 
          </tr>'; 
    $total++;
    $no++;
} 
?>

3. Click to Copy a Field's Content (e.g., Code) #

If you want users to click the code field to copy its value to clipboard, use a small JavaScript function paired with your PHP:

First, add this script somewhere on your page (before the table):

function copyToClipboard(text) {
    navigator.clipboard.writeText(text).then(() => {
        alert('Copied to clipboard!');
    }).catch(err => {
        console.error('Failed to copy: ', err);
    });
}

Then modify your PHP code to add the click event to the code cell:

<?php 
$no = 1; 
$total = 0; 
while ($row = mysqli_fetch_array($query)) { 
    $category = $row['category'] == 0 ? '' : number_format($row['category']);
    // Make code cell clickable for copying (addslashes handles quotes in the code value)
    $clickableCode = '<td onclick="copyToClipboard(\''.addslashes($row['code']).'\')" style="cursor: copy;">'.$row['code'].'</td>';
    
    echo '<tr> 
            <td>'.$no.'</td> 
            <td>'.$row['id'].'</td> 
            <td>'.$row['url'].'</td> 
            '.$clickableCode.' 
            <td>'.$category.'</td> 
          </tr>'; 
    $total++;
    $no++;
} 
?>

Pick the scenario that fits your needs, and adjust the page paths/functionality to match your project setup!

内容的提问来源于stack exchange，提问作者hexphp111