2014-08-31 2 views
0

У меня есть очень простой код, где у меня есть две страницы HTML, index.html - основная страница аутентификации, а crap.html - это страница, где я, ну, какая-то дерьмо.
Теперь у меня есть форма на index.html, у которой есть прикрепленный к ней обработчик onsubmit(), чтобы я мог проверить имя пользователя и пароль. Если это правильно, оно отображает сообщение и переходит к перенаправлению пользователя на crap.html.
Теперь проблема заключается в том, что это перенаправление работает нормально для неправильных учетных данных, но при получении правильных учетных данных оно автоматически перезагружает страницу index.html, даже если в auth.js отсутствует код для перенаправления.Перенаправление JS не работает как ожидалось

Вот коды:


auth.js

function passCheck(){ 
var user = document.getElementById("username").value; 
var pass = document.getElementById("password").value; 
var error = document.getElementById("error"); 
var set_user = "admin"; 
var set_pass = "admin"; 

if(user==set_user && pass==set_pass){ 
    error.style.color="green"; 
    error.innerHTML = "AUTHENTICATED CORRECTLY. REDIRECTING NOW."; 
    setTimeout(function(){ 
     window.location.href="../crap.html"; 
    }, 3000); 
}else{ 
    error.style.color="red"; 
    error.innerHTML = "WRONG CREDENTIALS. REDIRECTING NOW."; 
    setTimeout(function(){ 
     window.location.href="../index.html"; 
    }, 1000); 
    } 
} 

index.html

<html> 
<head> 
<title>Authentication</title> 
    <script src="js/jquery.js"></script> 
    <script src="js/auth.js"></script> 
    <link rel="stylesheet" type="text/css" href="css/style.css"> 
</head> 
<body> 
    <form onsubmit="passCheck()"> 
     <table border=0> 
      <tr> 
       <td>Username</td> 
       <td><input type="text" id="username" placeholder="Username" required autofocus></td> 
      </tr> 
      <tr> 
       <td>Password</td> 
       <td><input type="password" id="password" required></td> 
      </tr> 
      <tr> 
       <td colspan="2"> 
        <input type="submit" value="AUTHENTICATE"> 
       </td> 
      </tr> 
     </table> 
    </form> 
     <center> 
      <div id="error"></div> 
     </center> 
    </body> 
</html> 
+0

Вы пробовали поместить полный URL вместо .../crap.html? Может ли сузить проблему. – ltalhouarne

+0

Пробовал. Не работает. –

+0

@lolkidoki, даже если я оставил часть перенаправления, он все равно перезагружает страницу автоматически. –

ответ

2

Причина перезагрузки страницы заключается в том, что форма отправляется на ту же страницу. Ваша форма не имеет свойства действия. Чтобы предотвратить отправку формы, вам необходимо отправить return false; с вашего обработчика.

В качестве альтернативы, установите действие формы в обработчике отправки. Вы можете сделать это легко с jQuery.

+0

Это работало как шарм. Я возвратил 'false' в обоих случаях, что имело значение. –