2017-11-25 129 views
1

我有一个问题,我无法解决。 我做了一个简单的php登录脚本,即使用SQL数据库来获取登录数据。如果你登录,你应该得到一个弹出窗口,然后它应该重新定向到主页面。我无法得到它的工作。这是我当前的代码:PHP确认弹出用户登录

<?php 
     session_start(); 
     $pdo = new PDO('mysql:host=localhost;dbname=users', 'root', ''); 

     if(isset($_GET['login'])) { 
      $username = $_POST['username']; 
      $passwort = $_POST['password']; 

      $statement = $pdo->prepare("SELECT * FROM users WHERE username = :username"); 
      $result = $statement->execute(array('username' => $username)); 
      $user = $statement->fetch(); 

      if ($user !== false && password_verify($passwort, $user['password'])) { 
       $_SESSION['userid'] = $user['id']; 
       echo 'href=# class="big-link" data-reveal-id)"myModal"'; 
       die('Login erfolgreich. Weiter zu <a href="geheim.php">internen Bereich</a>'); 
      } else { 
       $errorMessage = "E-Mail oder Passwort war ungültig<br>"; 
      } 
     } 
?> 
<!DOCTYPE html> 
<html> 
<title>Login</title> 
    <head> 
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.min.js"></script> 
    <script type="text/javascript" src="jquery.reveal.js"></script> 
    <link rel="shortcut icon" type="image/x-icon" href="/favicon.ico"> 
     <link rel="stylesheet" type ="text/css" href="styles.css"> 
    </head> 
    <body> 
     <?php 
      if(isset($errorMessage)) { 
      echo $errorMessage; 
      } 
     ?> 
     <a href="#" class="big-link" data-reveal-id="myModal"> 
      Fade and Pop 
     </a> s 
    <div class="Header"> 
     Login 
</div> 
    <div class="Navbar"> 
      <a href="./index.php">Main</a> 
      <a href="./uebersicht.php">Übersicht</a> 
      <a href="./login.php">Login</a> 
     </div> 
    <div id="myModal" class="reveal-modal"> 
     <h1>Login erfolgreich</h1> 
     <p>Du wirst gleich weitergeleitet</p> 
     <a class="close-reveal-modal">&#215;</a> 
    </div> 
    <div class="Login"> 
     <form action="?login=1" method="post"> 
      <ul> 
      <li> 
       <label for="Username">Benutzer </label> 
       <input id="Username" type="text" name="username"> 
      </li> 
      <li><label for "Password">Passwort  </label> 
       <input id="Password" type="Password" name="password"> 
      </li> 
      <li> 
       <button>anmelden</button> 
      </li> 
      </ul> 
     </form>   
</body> 
</html> 

我使用“显示”模式弹出我的弹出。弹出窗口本身的工作通过点击

编辑href:我styles.css中的相关部分

.reveal-modal-bg { 
    position: fixed; 
    height: 100%; 
    width: 100%; 
    background: #000; 
    background: rgba(0,0,0,.8); 
    z-index: 100; 
    display: none; 
    top: 0; 
    left: 0; 
    } 

.reveal-modal { 
    visibility: hidden; 
    top: 100px; 
    left: 50%; 
    margin-left: -300px; 
    width: 520px; 
    background: #eee url(modal-gloss.png) no-repeat -200px -80px; 
    position: absolute; 
    z-index: 101; 
    padding: 30px 40px 34px; 
    -moz-border-radius: 5px; 
    -webkit-border-radius: 5px; 
    border-radius: 5px; 
    -moz-box-shadow: 0 0 10px rgba(0,0,0,.4); 
    -webkit-box-shadow: 0 0 10px rgba(0,0,0,.4); 
    -box-shadow: 0 0 10px rgba(0,0,0,.4); 
    } 

.reveal-modal.small   { width: 200px; margin-left: -140px;} 
.reveal-modal.medium  { width: 400px; margin-left: -240px;} 
.reveal-modal.large   { width: 600px; margin-left: -340px;} 
.reveal-modal.xlarge  { width: 800px; margin-left: -440px;} 

.reveal-modal .close-reveal-modal { 
    font-size: 22px; 
    line-height: .5; 
    position: absolute; 
    top: 8px; 
    right: 11px; 
    color: #aaa; 
    text-shadow: 0 -1px 1px rbga(0,0,0,.6); 
    font-weight: bold; 
    cursor: pointer; 
    } 
+0

你不显示你成功的模式。 '$('#myModal')。modal('show')'这是为JS btw而不是PHP – JeanPaul98

+0

$('#myModal')。modal('show')将与基于引导的UI框架一起工作。不知道styles.css里面有什么,因为这里使用了“jquery.reveal.js”(jQuery中的模式插件)。 – Abhishek

+0

这是我的styles.css的相关部分: –

回答

0

不知道这是否会甲阶您的问题,但是,你可以给它一个尝试

<a href="#" id="open_modal" class="big-link" data-reveal-id="myModal">Fade and Pop</a> 

<?php if(isset($errorMessage)) { 
    echo $errorMessage; 
} else { 
?> 
<script type="text/javascript"> 
    $('#open_modal').click(); 
</script> 
<?php } ?> 

,你也应该使用最新的JQuery:

<script src="http://code.jquery.com/jquery-3.2.1.min.js"></script> 

另一件事情是,它使生活中,如果你使用Bootstrap当你想与模态工作

+0

其实我不想让“Fade and Pop”出现在网站上,我只是将它从示例代码中拉出来。 –

0

修改您PHP代码,同时检查有效的用户凭据简单:

if ($user !== false && password_verify($passwort, $user['password'])) { 
       $_SESSION['userid'] = $user['id']; 
       $successMessage = "<script>$('a.big-link').trigger('click');</script>"; 
       die('Login erfolgreich. Weiter zu <a href="geheim.php">internen Bereich</a>'); 
      } else { 
       $errorMessage = "E-Mail oder Passwort war ungültig<br>"; 
      } 

HTML页面的修改:

<body> 
     <?php 
      if(isset($errorMessage)) { 
      echo $errorMessage; 
      } 
      else if(isset($successMessage)) 
      echo $successMessage; 
     ?> 
+0

这似乎不起作用,我仍然没有弹出。基本上我想要做的是,成功登录后,我想要一个确认弹出窗口,然后它应该重定向到另一个页面。 –

+0

编辑答案,尝试是否可行 – Abhishek

+0

使用未定义的常量successMessage - 在第36行的C:\ xamp \ htdocs \ login.php中假设'successMessage'是我所得到的。还试着在session_start()之后直接移动$ successMessage变量() –