我是php和js的新手。我想通过单击show按钮显示我的表格。但它不起作用。我的表格仅在我单击显示按钮时才显示。我是一名PHP学生，请帮助我。
<!DOCTYPE HTML>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<link href="css/bootstrap.css" rel='stylesheet' type='text/css' />
<link href="css/style.css" rel='stylesheet' type='text/css' />
<link href='//fonts.googleapis.com/css?family=Open+Sans:400,700,600' rel='stylesheet' type='text/css'>
<link href='//fonts.googleapis.com/css?family=Roboto+Condensed:400,700,300' rel='stylesheet' type='text/css'>
<link href='//fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>
<link href="css/font-awesome.css" rel="stylesheet">
<link href="vendor/fontawesome-free/css/all.min.css" rel="stylesheet" type="text/css">
<!-- Custom Theme files -->
<script src="js/jquery-1.12.0.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<!--animate-->
<link href="css/animate.css" rel="stylesheet" type="text/css" media="all">
<script src="js/wow.min.js"></script>
<script>
new WOW().init();
</script>
</head>
<style>
#home {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
border-collapse: collapse;
}
#home td, #home th {
border: 1px solid #ddd;
padding: 5px;
}
#home tr:nth-child(even){background-color: #f2f2f2;}
#home tr:hover {background-color: #ddd;}
#home th {
padding-top: 12px;
padding-bottom: 12px;
text-align: left;
background-color: #007bff;
color: white;
}
</style>
<style type="text/css">
#profile {
display: none;
}
</style>
<body>
<?php include('include/header.php');?>
<div class="banner3" style="background: url(images/17.jpg); background-size: cover;">
<div class="container">
<h1 class="wow zoomIn animated animated" data-wow-delay=".5s" style="visibility: visible; animation-delay: 0.5s; animation-name: zoomIn;">My Tour</h1>
</div>
</div>
<form class="form-horizontal" method="post" style="padding-top: 75px;padding-right: 50px;padding-bottom: 100px">
<div class="form-group">
<label class="control-label col-sm-2" for="From">From:</label>
<div class="col-sm-10">
<select class="form-control" name="From" required/>
<option value="">------Select-----</option>
<option value="Kottayam">Kottayam</option>
<option value="Kollam">Kollam</option>
<option value="Kochi">Kochi</option>
<option value="TVM">TVM</option>
<option value="Munnar">Munnar</option>
<option value="Kozhikode">Kozhikode</option>
<option value="Muvattupuzha">Muvattupuzha</option>
</select>
</select>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="To">To:</label>
<div class="col-sm-10">
<select class="form-control" name="To" required/>
<option value="">------Select-----</option>
<option value="Kottayam">Kottayam</option>
<option value="Kollam">Kollam</option>
<option value="Kochi">Kochi</option>
<option value="TVM">TVM</option>
<option value="Munnar">Munnar</option>
<option value="Kozhikode">Kozhikode</option>
<option value="Muvattupuzha">Muvattupuzha</option>
</select>
</select>
</div>
</div>
<div class="control-label" style="padding-bottom: 50px">
<button type="submit" name="submit" class="btn-primary btn" formnovalidate onclick="detail();">Show</button>
</div>
</form>
<div id="profile">
<div>
<?php
$From =$_POST['From'];
$result = mysqli_query($conn,"SELECT veh_type,veh_driver,veh_drivno FROM vehicle where picup_point = '$From'") or die("Error: " . mysqli_error($conn));
?>
<table id="home" align="left" border="1" width="45%">
<tr><th>Vehicle Type</th>
<th>Driver</th>
<th>Phone Number</th></tr>
<?php
while($row = mysqli_fetch_array($result))
{
if(isset($_POST["submit"]))
{
$veht=$row['veh_type'];
$veho=$row['veh_driver'];
$vehno=$row['veh_drivno'];
?>
<tr>
<td><?php echo "$veht"; ?></td>
<td><?php echo "$veho"; ?></td>
<td><?php echo "$vehno"; ?></td>
</tr>
<?php } ?>
<?php } ?>
</table>
</div>
<div>
<?php
$To =$_POST['To'];
$result = mysqli_query($conn,"SELECT veh_type,veh_driver,veh_drivno FROM vehicle where picup_point = '$To'") or die("Error: " . mysqli_error($conn));
?>
<table id="home" border="1" align="right" width="45%">
<tr><th>Vehicle Type</th>
<th>Driver</th>
<th>Phone Number</th></tr>
<?php
while($row = mysqli_fetch_array($result))
{
if(isset($_POST["submit"]))
{
$veht=$row['veh_type'];
$veho=$row['veh_driver'];
$vehno=$row['veh_drivno'];
?>
<tr>
<td><?php echo "$veht"; ?></td>
<td><?php echo "$veho"; ?></td>
<td><?php echo "$vehno"; ?></td>
</tr>
<?php } ?>
<?php } ?>
</table>
</div>
<!----------------->
<div>
<?php
$From =$_POST['From'];
$result = mysqli_query($conn,"SELECT hotel_name,hotel_no,hotel_email FROM hotels where hotel_loc = '$From'") or die("Error: " . mysqli_error($conn));
?>
<table id="home" align="left" border="1" width="45%" style="padding-top: 25px">
<tr><th>Hotel</th>
<th>Phone Number</th>
<th>Email</th>
<th>Details</th></tr>
<?php
while($row = mysqli_fetch_array($result))
{
if(isset($_POST["submit"]))
{
$hot_name=$row['hotel_name'];
$hot_no=$row['hotel_no'];
$hot_email=$row['hotel_email'];
?>
<tr>
<td><?php echo "$hot_name"; ?></td>
<td><?php echo "$hot_no"; ?></td>
<td><?php echo "$hot_email"; ?></td>
<td><a href="hotels.php?hot_name=<?php echo $hot_name;?>"><i class="fas fa-hotel fa-fw" style="color: #17a2b8;"></i></a></td>
</tr>
<?php } ?>
<?php } ?>
</table>
</div>
<div>
<?php
$To =$_POST['To'];
$result = mysqli_query($conn,"SELECT hotel_name,hotel_no,hotel_email FROM hotels where hotel_loc = '$To'") or die("Error: " . mysqli_error($conn));
?>
<table id="home" align="right" border="1" width="45%">
<tr><th>Hotel</th>
<th>Phone Number</th>
<th>Email</th>
<th>Details</th></tr>
<?php
while($row = mysqli_fetch_array($result))
{
if(isset($_POST["submit"]))
{
$hot_name=$row['hotel_name'];
$hot_no=$row['hotel_no'];
$hot_email=$row['hotel_email'];
?>
<tr>
<td><?php echo "$hot_name"; ?></td>
<td><?php echo "$hot_no"; ?></td>
<td><?php echo "$hot_email"; ?></td>
<td><a href="hotels.php?hot_name=<?php echo $hot_name;?>"><i class="fas fa-hotel fa-fw" style="color: #17a2b8;"></i></a></td>
</tr>
<?php } ?>
<?php } ?>
</table>
</div>
</div>
<?php } ?>
JavaScript是
function detail() {
document.getElementById('profile').style.visibility = "visible";
}
仅当我单击显示按钮时，我的表才应显示。我是一名PHP学生，请帮助我。
答案 0 :(得分：1)
尝试一下：
function detail() {
document.getElementById('profile').style.display='block';
}
从onclick调用函数时，您也必须删除分号：
<button type="submit" name="submit" class="btn-primary
btn" formnovalidate="formnovalidate" onclick="detail()">Show</button>
答案 1 :(得分：0)
在您的javascript上向配置文件添加“＃”，您正在调用HTML DOM id属性。即
document.getElementById('#profile').style.visibility = "visible";
答案 2 :(得分：0)
$("#btn").click(function() {
$("#tblop").toggleClass("tbl_close");
});.tbl_open{
display:none;
}
.tbl_close{
display:block;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="tblop" class="tbl_open">
<thead>
<th>
<tr>
<td>Name</td>
<td>Salary</td>
</tr>
</th>
</thead>
<tbody>
<tr>
<td>Jhon</td>
<td>23400</td>
</tr>
</tbody>
</table>
<button id="btn" type=submit>click to show table</button>