Jquery 没有显示按钮

Question

试图在登录失败时显示提交按钮，但无法显示。

我的代码：-

<html>

<head>
<script src="https://code.jquery.com/jquery-3.5.1.min.js" ></script>
  <style>
    .hiddenFramehideclass {
      position: absolute;
      top: -1px;
      left: -1px;
      width: 1px;
      height: 1px;
    }
  </style>
</head>

<body>
  <form method="post" class="needs-validation" action="" enctype="multipart/form-data" id="loginform" target="hiddenFrame">
    <h2>Login</h2>
    <hr />
    <label for="emailid">Email: </label>
    <input id="emailid" type="text" placeholder="Email" name="txtulogindetail" required />
    <br /><br /><br />
    <label for="passwordid">Password: </label>
    <input id="passwordid" type="password" placeholder="Password" name="txtupass" required />
    <hr />
    <button type="submit" class="btn btn-success" name="btn-login" id="loginsubmitbutton">Sign in</button>
    <br /><br /><br />
    <span id="register_link"> <a href= "register">Register!</a></span>

    <hr />


  </form>

  <iframe name="hiddenFrame" class="hiddenFramehideclass"></iframe>
</body>

<script>
  /*Submit Button Clicked Function Starts */

  $("#loginsubmitbutton").click(function() {

    $("#loginsubmitbutton").hide(); //Hiding submit button
    $("#register_link").hide(); //Hiding Register Link

    /*Making Inputs to readonly Starts*/

    $("input").css({
      'pointer-events': 'none'
    });

    /*Making Inputs to readonly Ends*/


  });

  /*Submit Button Clicked Function Ends */
</script>


<?php
if(isset($_POST['btn-login'])) {

$email = trim($_POST['txtulogindetail']); 
$password = trim($_POST['txtupass']); 

$stmt = $myclass->runQuery("SELECT * FROM users WHERE Email=:lrn LIMIT 1");
$stmt->bindparam(":lrn",$email);
$stmt->execute();
if($stmt->rowCount() > 0){

if($myclass->login($email,$password)){
    echo '<script> alert("Logged In"); </script>';
}
else{
    echo '<script>         
        $("#loginsubmitbutton").show(); //Hiding submit button
        $("#register_link").show(); //Hiding Register Link 
        alert("Error");
        </script>';
}
}
else{
    echo '<script> alert("Email Not Found"); </script>';
}

}

?>


</html>

所以当我尝试使用以上代码登录时：

它会在凭据正确时提醒 已登录。
当凭据不正确（密码不正确）时，仅警告错误（但根据代码，它应该显示提交按钮再次。）
当找不到电子邮件

找不到电子邮件

Answer 1

事情是在任何 DOM 操作之前首先执行警报。您必须等待文件准备就绪。

尝试这样的事情：

echo '<script> 
        $(document).ready(function(){
           $("#loginsubmitbutton").show(); //Hiding submit button
           $("#register_link").show(); //Hiding Register Link 
        });        
      </script>';

此外，如果您保留警报，DOM 操作将需要 post 关闭警报。所以如果你想处理你必须触发一些事件并添加一个监听器来提醒。

Answer 2

您的脚本在 iframe 中运行。而您的脚本想要更改 parent 中的内容。为此，您应该告诉代码在哪里执行。 (parent.$().......)

下面将帮助您获得提交按钮。

echo '<script>         
    parent.$("#loginsubmitbutton").show(); //Hiding submit button
    parent.$("#register_link").show(); //Hiding Register Link 
    //alert("Error");
    </script>';

Jquery 没有显示按钮

Jquery not showing button

javascript

php

forms

jquery

show