Question

我使用php连接到数据库，并将表的所有行显示为网页上的表。现在我想要的是在每一行中都有一个复选框和一个隐藏按钮，这样当我点击一行中的一个复选框时，该行的相应按钮变为可见，当我点击该按钮时，该行将被删除。

这是我的php代码。我正在使用wordpress，因为wordpress不允许在页面上使用php，所以我使用插件shortcode-exec-php在wordpress页面启用php。但我认为这更像是一个编程问题，而不是wordpress支持问题。

// Connect to the database
$dbLink = new mysqli('127.0.0.1', 'abc', '123', 'test');
if(mysqli_connect_errno()) {
die("MySQL connection failed: ". mysqli_connect_error());
} 
// Query for a list of all existing files
$sql = 'SELECT `id`, `name`, `mime`, `size`, `created` FROM `file`';
$result = $dbLink->query($sql);
// Check if it was successfull
if($result) {
 // Make sure there are some files in there
if($result->num_rows == 0) {
    echo '<p>There are no files in the database</p>';
}
else {
    // Print the top of a table
    echo '<table width="100%">
            <tr>
                <td><b>Name</b></td>
                <td><b>Mime</b></td>
                <td><b>Size (bytes)</b></td>
                <td><b>Created</b></td>
                <td><b>&nbsp;</b></td>
            </tr>';
    // Print each file
    while($row = $result->fetch_assoc()) {
    echo "
            <tr>
                <td>{$row['name']}</td>
                <td>{$row['mime']}</td>
                <td>{$row['size']}</td>
                <td>{$row['created']}</td>
                <td><a href='get_file.php?id={$row['id']}'>Download</a></td>
               //here i want a code that insert a checkbox and a hidden button with                             the above mentioned functionalty
             </tr>";    
}
    // Close table
   echo "</table>";
}
// Free the result
$result->free();
}
else 
{
echo 'Error! SQL query failed:';
echo "<pre>{$dbLink->error}</pre>";
} 
// Close the mysql connection
$dbLink->close();

有人能帮助我吗？

如果你提到javascript，请告诉我一种在现有代码中使用它的方法。

Answer 1

这是一个可以帮助你的代码（使用jquery）：

腓：

 echo "
        <tr>
            <td>{$row['name']}</td>
            <td>{$row['mime']}</td>
            <td>{$row['size']}</td>
            <td>{$row['created']}</td>
            <td><a href='get_file.php?id={$row['id']}'>Download</a></td>
             <td><input type='checkbox' class='checkbox'><input type='button' style='display:none' value='delete' name='delete'><input type='button' style='display:none' value='edit'  name='edit'></td>
         </tr>";

的Jquery：

$(document).ready(function(){
 $("input[type=checkbox]").on("click", function () {
   ($(this).is(":checked")) ? $(this).nextAll("input").show() : $(this).nextAll("input").hide();
 });
 $("input[name='delete']").on("click", function () {
   $(this).closest("table tr").remove();
 });
   $("input[name='edit']").on("click", function () {
    $(this).closest("tr").attr("contenteditable",true).focus();
  });
});

以下是演示：http://jsfiddle.net/hctyP/2/

如何在点击php中的复选框后显示隐形按钮？

1 个答案: