组合框在提交更改时给出结果，但刷新 JavaScript 设置
Comboboxes onsubmit changes giving results but refreshes javascript setting
>我有一个有 3 个按钮的 html 页面，这些按钮在单击事件时显示相应的隐藏div 和表单。按钮的 html 是 ：
<button id="edituser" type="submit" onclick="toggle_visibility('c');" style="border:0;width:100px;margin-left: 74px;">
<img src="images/edituser.png" alt="">
</button><br><br>
<button id="companyprofile" type="submit" onclick="toggle_visibility('d');" style="border:0;width:100px;margin-left: 74px;">
<img src="images/companyprofile.png" alt="">
</button><br><br>
<button id="checkticket" type="submit" onclick="toggle_visibility('e');" style="border:0;width:100px;margin-left: 74px;">
<img src="images/checkticket.png" alt="">
</button><br><br>
在单击这些按钮时使用此 js 代码，我们可以选择 htmldiv。
function toggle_visibility(id) {
var e = document.getElementById(id);
if(document.getElementById("c").id == id)
{
e.style.display = 'block';
document.getElementById("a").style.display='none';
document.getElementById("b").style.display='none';
document.getElementById("g").style.display='none';
document.getElementById("d").style.display='none';
document.getElementById("e").style.display='none';
document.getElementById("f").style.display='none';
document.getElementById("edituser").style.backgroundImage="url('images/edit_user_hover.png')";
}
if(document.getElementById("d").id == id)
{
e.style.display = 'block';
document.getElementById("a").style.display='none';
document.getElementById("b").style.display='none';
document.getElementById("c").style.display='none';
document.getElementById("g").style.display='none';
document.getElementById("e").style.display='none';
document.getElementById("f").style.display='none';
document.getElementById("companyprofile").style.backgroundImage="url('images/edit_company_hover.png')";
}
if(document.getElementById("e").id == id)
{
e.style.display = 'block';
document.getElementById("a").style.display='none';
document.getElementById("b").style.display='none';
document.getElementById("c").style.display='none';
document.getElementById("g").style.display='none';
document.getElementById("d").style.display='none';
document.getElementById("f").style.display='none';
document.getElementById("checkticket").style.backgroundImage="url('images/Check_ticket_hover.png')";
}
div 的 html
给出如下：<div class="col-lg-6" style="display:none" id="c" >
<form action="" method="post" name="Country_Filter" id="Country_Filter" >
<select name="id" id="id" class="span2" style="width:150px;" onchange="disp_div()" onchange="this.form.submit();" >
<?php
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "v";
// Create connection
$conn = mysqli_connect($servername, $username, $password, $dbname);
// Check connection
if (!$conn) {
die("Connection failed: " . mysqli_connect_error());
}
$age = array();
$sql = "SELECT * FROM `tbl_user` ";
$result = mysqli_query($conn, $sql);
// echo "User name=" . $row["name"]. "<br>";
?>
<option value="">-select user-</option>
<?php if (mysqli_num_rows($result) > 0) {
// output data of each row
while($row = mysqli_fetch_assoc($result)) {
$age[] = $row;
}
?>
<?php foreach($age as $key=>$row) {
echo "<option value='" . $row['id'] . "' " . (($_REQUEST['id'] == $row['id']) ? "selected": "") . ">" . $row["id"] . "</option>";
?>
<?php }
}
else {
echo "Error: " . $sql . "<br>" . mysqli_error($conn);
header('Location: webservices.php');
}
mysqli_close($conn);
?>
</select>
<form id="aa" action="" method="GET" >
<?php
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "v";
// Create connection
$conn = mysqli_connect($servername, $username, $password, $dbname);
// Check connection
if (!$conn) {
die("Connection failed: " . mysqli_connect_error());
}
$age = array();
if(isset($_REQUEST['id'])){
$sql = "SELECT first_name ,last_name, phone, company_id, register_on FROM `tbl_user` where id=".$_REQUEST['id'] ." ";
$result = mysqli_query($conn, $sql);
// echo "User name=" . $row["name"]. "<br>";
if (mysqli_num_rows($result) > 0) {
// output data of each row
while($row = mysqli_fetch_assoc($result)) {
$age[] = $row;
?>
<br><br>
<br>
<input type="text" id="first_name" value="<?php echo $row["first_name"]; ?>" name="first_name" style="width: 460px;height: 50px;overflow: hidden;" placeholder="First Name*">
<br>
<br><br><br>
<input type="text" id="last_name" value="<?php echo $row["last_name"]; ?>" name="last_name" style="width: 460px;height: 50px;overflow: hidden;" placeholder="Last Name*">
<br><br><br><br>
<input type="text" id="phone" value="<?php echo $row["phone"]; ?>" name="phone" style="width: 460px;height: 50px;overflow: hidden;" placeholder="Phone*">
<br><br><br><br>
<input type="text" id="company_id" value="<?php echo $row["company_id"]; ?>" name="company_id" style="width: 460px;height: 50px;overflow: hidden;" placeholder="Company ID*">
<br><br><br><br>
<input type="text" id="register_on" value="<?php echo $row["register_on"]; ?>" name="register_on" style="width: 460px;height: 50px;overflow: hidden;" placeholder="Register On*">
<br><br><br><br>
<button name="edituser" id="edituser" type="submit" style="border:0;width:100px;margin-left: 45px;" >
<img src="images/save.png" alt="">
</button>
<button type="submit" style="border:0;width:100px;margin-left: 75px;">
<img src="images/cancel.png" alt="">
</button>
<?php
}
}
}
mysqli_close($conn);
?>
</form>
</div>
<div class="col-lg-6" style="display:none" id="d" >
<form action="" id="abc" method="post" >
<select name="id" id="id" class="span2" style="width:150px;" onchange="this.form.submit();">
<?php
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "v";
// Create connection
$conn = mysqli_connect($servername, $username, $password, $dbname);
// Check connection
if (!$conn) {
die("Connection failed: " . mysqli_connect_error());
}
$age = array();
$sql = "SELECT * FROM `tbl_companies` ";
$result = mysqli_query($conn, $sql);
// echo "User name=" . $row["name"]. "<br>";
?>
<option value="">-select company-</option>
<?php if (mysqli_num_rows($result) > 0) {
// output data of each row
while($row = mysqli_fetch_assoc($result)) {
$age[] = $row;
}
?>
<?php foreach($age as $key=>$row) {
echo "<option value='" . $row['id'] . "' " . (($_REQUEST['id'] == $row['id']) ? "selected": "") . ">" . $row["id"] . "</option>";
?>
<?php }
}
else {
echo "Error: " . $sql . "<br>" . mysqli_error($conn);
header('Location: webservices.php');
}
mysqli_close($conn);
?>
</select>
<br><br>
<br>
<?php
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "v";
// Create connection
$conn = mysqli_connect($servername, $username, $password, $dbname);
// Check connection
if (!$conn) {
die("Connection failed: " . mysqli_connect_error());
}
$age = array();
if(isset($_REQUEST['id'])){
$sql = "SELECT company_name ,acess_code ,register_on FROM `tbl_companies` where id=".$_REQUEST['id'] ." ";
$result = mysqli_query($conn, $sql);
// echo "User name=" . $row["name"]. "<br>";
if (mysqli_num_rows($result) > 0) {
// output data of each row
while($row = mysqli_fetch_assoc($result)) {
$age[] = $row;
?>
<br><br><br>
<input type="text" id="company_name" value="<?php echo isset($row["company_name"])?$row["company_name"]:''; ?>" name="company_name" style="width: 460px;height: 50px;overflow: hidden;" placeholder="Company Name*">
<br>
<br><br><br>
<input type="text" id="acess_code" value="<?php echo isset($row["acess_code"])?$row["acess_code"]:''; ?>" name="acess_code" style="width: 460px;height: 50px;overflow: hidden;" placeholder="Acess Code*">
<br><br><br><br>
<input type="text" id="register_on" value="<?php echo isset($row["register_on"])?$row["register_on"]:''; ?>" name="register_on" style="width: 460px;height: 50px;overflow: hidden;" placeholder="Register On*">
<br><br><br><br>
<button name="editcompany" id="editcompany" type="submit" style="border:0;width:100px;margin-left: 45px;" >
<img src="images/save.png" alt="">
</button>
<button type="submit" style="border:0;width:100px;margin-left: 75px;">
<img src="images/cancel.png" alt="">
</button>
<?php
}
}
}
mysqli_close($conn);
?>
</form>
</div>
<div class="col-lg-6" style="display:none" id="e" >
<form action="" method="post" name="Country_Filter" id="Country_Filter" >
<select name="id" id="id" class="span2" style="width:150px;" onchange="this.form.submit();">
<?php
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "v";
// Create connection
$conn = mysqli_connect($servername, $username, $password, $dbname);
// Check connection
if (!$conn) {
die("Connection failed: " . mysqli_connect_error());
}
$age = array();
$sql = "SELECT * FROM `tbl_tickets` ";
$result = mysqli_query($conn, $sql);
// echo "User name=" . $row["name"]. "<br>";
?>
<option value="">-select tickets-</option>
<?php if (mysqli_num_rows($result) > 0) {
// output data of each row
while($row = mysqli_fetch_assoc($result)) {
$age[] = $row;
}
?>
<?php foreach($age as $key=>$row) {
echo "<option value='" . $row['id'] . "' " . (($_REQUEST['id'] == $row['id']) ? "selected": "") . ">" . $row["id"] . "</option>";
?>
<?php }
}
else {
echo "Error: " . $sql . "<br>" . mysqli_error($conn);
header('Location: webservices.php');
}
mysqli_close($conn);
?>
</select>
</form>
<form action="" method="post" id="e" >
<?php
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "v";
// Create connection
$conn = mysqli_connect($servername, $username, $password, $dbname);
// Check connection
if (!$conn) {
die("Connection failed: " . mysqli_connect_error());
}
$age = array();
if(isset($_REQUEST['id'])){
$sql = "SELECT ticket_no ,user_id ,ticket_status ,register_on FROM `tbl_tickets` where id=".$_REQUEST['id'] ." ";
$result = mysqli_query($conn, $sql);
// echo "User name=" . $row["name"]. "<br>";
if (mysqli_num_rows($result) > 0) {
// output data of each row
while($row = mysqli_fetch_assoc($result)) {
$age[] = $row;
?>
<br><br><br>
<input type="text" name="FirstName" value="<?php echo $row["ticket_no"] ;?>" style="width: 460px;height: 50px;overflow: hidden;" placeholder="Ticket Owner Name*" readonly>
<br>
<br><br><br>
<input type="text" name="LastName" value="<?php echo $row["user_id"]; ?>" style="width: 460px;height: 50px;overflow: hidden;" placeholder="Registration Date*" readonly>
<br><br><br><br>
<input type="text" name="LastName" value="<?php echo $row["ticket_status"]; ?>" style="width: 460px;height: 50px;overflow: hidden;" placeholder="Expire Date*" readonly>
<br><br><br><br>
<input type="text" name="LastName" value="<?php echo $row["register_on"]; ?>" style="width: 460px;height: 50px;overflow: hidden;" placeholder="Expire Time Status*" readonly>
<br><br><br><br>
<button name="chkticketstatus" id="chkticketstatus" type="submit" style="border:0;width:100px;margin-left: 45px;">
<img src="images/save.png" alt="">
</button>
<button type="submit" style="border:0;width:100px;margin-left: 75px;">
<img src="images/cancel.png" alt="">
</button>
<?php
}
}
}
mysqli_close($conn);
?>
</form>
</div>
我面临的问题是用户使用函数在按钮单击时选择 htmldiv（onclick="toggle_visibility（'c'）;"）出现组合框，当从组合框提交值时，它会刷新页面并加载默认的可见div。如何使 htmldiv 可见哪个组合框在页面重新加载后提交了值？
您可以通过更改表单提交方式来实现此目的。不要提交整个页面，而是可以使用 ajax 方式提交表单。基本上，ajax是一种无需重新加载整个页面即可提交表单的方法。这样，您选择的div 将被保留。
阿贾克斯参考：
http://www.w3schools.com/jquery/jquery_ref_ajax.asp
http://api.jquery.com/jquery.ajax/
好的！如果你不想使用 Ajax，你可以在页面重新加载后调用 toggle_visibility（） 函数来实现这一点。
方法A：如果你不使用JQuery，可以通过在html正文的底部放置脚本标签来实现：
<html>
<head>...</head>
<body>
<div class="col-lg-6" style="display:none" id="c" >
<form action="" method="post" name="Country_Filter" id="Country_Filter" >
...
...
</form>
</div>
<script>
toggle_visibility('C'); // hence you can make the html div visible for which combo-box has submitted value after page reloads
</script>
</body>
</html>
方法B：如果JQuery包含在你的页面上，只需将其放入你的java脚本文件中：
$(document).ready(function(){
toggle_visibility('C'); // hence you can make the html div visible for which combo-box has submitted value after page reloads
});
PS：这里你需要将div缩写传递到toggle_visibility函数中。可以通过从 db 获取值并知道上次提交的内容来决定。
相关文章：
- 强制模板刷新ember.js
- 如何通过ajax刷新JSF填充的javascript变量
- Javascript，输出结果后页面不断刷新
- 使用php脚本验证访问者的年龄，并在不刷新的情况下根据结果加载iframe
- ajax在页面刷新之前不会加载新的sql结果
- 使用下拉列表中的值查询 MySQL 数据库，然后使用结果填充文本字段而不刷新页面
- 从包含的 php 文件刷新查询结果
- 如何保存投票结果，并在页面刷新时不还原
- 如何使用 jQuery 将变量从隐藏字段发送到远程 PHP 文件，并在引导模式中显示脚本的结果，而无需刷新
- 组合框在提交更改时给出结果，但刷新 JavaScript 设置
- 如何在从线程收到一些结果后使用 java 脚本停止自动刷新功能
- AJAX-页面刷新结果加倍
- jquery/ajax以用户输入为条件运行php查询，然后显示查询结果而不刷新页面
- 从PHP文件结果自动刷新标题网页
- 如何显示php传递的结果到ajax没有刷新
- 如何在不刷新页面的情况下刷新MySQL查询的结果?
- 在不重新加载页面的情况下定期刷新结果
- 每5秒读取一次MYSQL表，并在PHP页面上动态显示结果，而无需刷新
- 刷新表单结果而不刷新页面
- 自动刷新和检索json的结果
