如何在引脚检查后在不单击关闭按钮的情况下卸载叠加层

问题描述 投票:0回答:1

打开覆盖层时,我有一个页面正在加载并要求进行引脚验证。 pin 检查是通过 php on action="" 这一切正常,但我不知道如何在引脚正确后自动关闭覆盖层。我没有任何问题显示要单击的关闭按钮,但我希望它自动...

脚本是:

<script>
function on() {document.getElementById("overlay").style.display = "block";}

function off() {document.getElementById("overlay").style.display = "none";} 
</script>

我可以用这个在 php 中关闭它,但是我怎样才能自动完成它?

  <body class="page" onLoad="on();" >

<!--##################################### -->
<!--##### OVERLAY ####################### -->
<!--##################################### -->   
<div id="overlay" >
<div id="suche">


<form class="was-validated" method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>" autocomplete="off" id="buchen2">

<div class="form-row">
            <div class="form-group col-md-4" >
                <label for="usr">Enter Security PIN<div class="toolitip"> <a class="fa fa-info-circle" style="color: blue;"></a><span class="toolitiptext">Please enter your security PIN. If you do not have a PIN, ask the administrator! </span></div></label>
                <input type="password" class="form-control" id="pin" name="pin" pattern="[0-9]{4}" onChange="submit();" required>
            </div>
</div>
</form>
<?      
include('db.php');
?>

<?
$pin = $_POST["pin"];
$ergebnis = $dbconnection->query("select usr, pin from user where usr = '$user' limit 1")
                        or die($dbconnection->error);
while($row = $ergebnis->fetch_object()){
    
    $pinD=$row->pin;
}
    if ($pin == $pinD) {
 echo "<script>
function off() {
  document.getElementById('overlay').style.display = 'none';
}       
</script>"; 
echo "<p> Code is good! Please close the Overlay to continue </p>";
echo "<button type='button' onclick='off()' class='btn btn-primary btn-lg' name='erledigt'>CLOSE and continue</button>  ";

 echo "<script>
 off();
</script>";

 echo "<script>
function off() {
  document.getElementById('overlay').style.display = 'none';
}       
</script>"; 


    }
    
    else {
        echo "<p> You must enter the correct code</p>";
    }
?>

</div>  
</div>
<!--##################################### -->
<!--##### OVERLAY ####################### -->
<!--##################################### -->   

在 php if 语法中自动卸载覆盖层。 我只能使用 onclick="off" 但如何在不点击的情况下运行“off”?

javascript php onclick overlay
1个回答
0
投票

我不明白你需要 javascript 做什么。只需首先执行 PHP 逻辑,然后输出覆盖(如果未输入 PIN 或输入错误的 PIN)或不输出(如果 PIN 正常)。

选项1:无JS

<?php
$pin_ok = false;
$pin_checked = false;

if(isset($_POST['pin'])) {
    // Is form submit
    $pin_checked = true;
    if($_POST['pin'] == '12345') {
        // PIN ok
        $pin_ok = true;
    } 
}
?>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body class="page" onLoad="on();" >
    <?php if(!$pin_ok) { ?>
    <!--##################################### -->
    <!--##### OVERLAY ####################### -->
    <!--##################################### -->   
    <div id="overlay" >
        <div id="suche">


            <form class="was-validated" method="post" action="" autocomplete="off" id="buchen2">

                <div class="form-row">
                    <div class="form-group col-md-4" >
                        <label for="usr">Enter Security PIN<div class="toolitip"> <a class="fa fa-info-circle" style="color: blue;"></a><span class="toolitiptext">Please enter your security PIN. If you do not have a PIN, ask the administrator! </span></div></label>
                        <input type="password" class="form-control" id="pin" name="pin" pattern="[0-9]{4}" onChange="submit();" required>
                    </div>
                </div>
            </form>
            <?php
                if($pin_checked) {
                    // This happens only if wrong PIN was submitted
                    echo "<p>You must enter the correct code</p>";
                }
            ?>
        </div>  
    </div>
    <!--##################################### -->
    <!--##### OVERLAY ####################### -->
    <!--##################################### -->
    <?php } //if(!$pin_ok) ?>
    [...] REST OF YOUR CONTENT HERE [...]
</body>
</html>

如果您有其他使用 javascript 的原因,请公开它,我很乐意用更多选项来扩展此答案。

© www.soinside.com 2019 - 2024. All rights reserved.