来自 PHP 脚本的 jQuery 调用模式答案

【问题标题】：jQuery call modal from PHP script来自 PHP 脚本的 jQuery 调用模式
【发布时间】：2019-01-02 04:00:42
【问题描述】：

我正在创建一个登录脚本来检查用户是否存在于表中。

如果用户不存在，我想使用 jquery 打开一个模式窗口，让用户知道有错误。

 <?php
   include("../include/database.php");
   if(isset($_GET['loginSubmit']))   // form submit button
   {
 // form username and password values
     $username = strip_tags(mysqli_real_escape_string($dbc, trim($_GET['username'])));
     $password = strip_tags(mysqli_real_escape_string($dbc, trim(md5($_GET['password']))));

 // set query
     $select = "SELECT username, fullname, userlevel, `password` FROM users WHERE username = '".$username."'"; 
 // run query
     $query = mysqli_query($dbc, $select);
 // get the results
     $row = mysqli_fetch_array($query);
 // set the results to variables to be used in sessions
     $dbusername = htmlentities(stripslashes($row['username']));    
     $dbfullname = htmlentities(stripslashes($row['fullname']));
     $dbuserlevel = htmlentities(stripslashes($row['userlevel']));
     $dbpassword = htmlentities(stripslashes($row['password']));

 // check if the database password matches the user password
     if($dbpassword == $password)
     {
 // if yes, set the sessions and direct to main page
       $_SESSION['username'] = $username;
       $_SESSION['fullname'] = $dbfullname;
       $_SESSION['userlevel'] = $dbuserlevel;
       header("Location:main.html"); 
     }
     else
     {
 // if no match, this is where I want the javascript to show the modal
       echo ("<script language='javascript'>
              $('#errLoginModal').modal('show');  // this is jquery and I know it's incorrect
              window.location.href='index.php'
              </script>");
     }  
 ?>

我仍在努力改进 JavaScript、jQuery 和 PHP。使用 Stack Overflow，我变得越来越好。

我希望 PHP 脚本在用户名/密码检查失败时使用 JavaScript/jQuery 来触发模式窗口。我什至不确定这是否是最好的方法。

我知道上面的代码不正确。我的意思是它不会显示一个模式窗口。

另一方面，我可以添加一个警报，它会像这样触发警报：

 else
 {
   echo ("<script language='javascript'>
          alert(test);
          window.location.href='index.php'
          </script>");
 }

这行得通。我只是希望它能够显示模态。

【问题讨论】：

jQuery UI 的dialog 小部件将为您提供最佳服务。
您是否通过 ajax 提交表单？如果没有，您可能应该作为模式窗口在新加载的页面/问题内容中没有多大意义。

标签： javascript php jquery modal-dialog

【解决方案1】：

你可以尝试包含js文件。

 }else{

   echo `<script src="you_file.js"></script>`
 }

    //you_file.js

(function ($){
    $(document).ready(function() {
        alert(`test`);
        $('#errLoginModal').modal('show');  
        window.location.href='index.php';
    })
})

当然在此之前包括 jquery

【讨论】：

我使用的 jquery 文件是 jQuery-2.1.3.min.js，但它位于我的首页底部附近，称为 index.php。这可能是脚本仍然无法正常工作的原因吗？
谢谢您，先生。我能够使用您的帖子评论回答这个问题。

【解决方案2】：

我假设您正在使用 Bootstrap 打开模态窗口，因为您使用的是.modal('show')。确保在 HTML <head></head> 中包含 jquery 以及引导 js 文件。

如果模态窗口位于对$('#errLoginModal').modal('show'); 的调用下方，则需要使用jQuery .ready 事件，该事件将在DOM 完全加载后触发docs。

所以你应该看起来像这样：

else {
    echo ("<script language='javascript'>
        $( document ).ready(function() {
          $('#errLoginModal').modal('show');
        });
        </script>");
}

【讨论】：

我能够结合使用您的代码和 Vlad Mazur 的代码来找出我的问题。谢谢你，先生。