onSubmit кнопка не загружается.

Question

Я переключился с type=click на type=submit, так что я могу использовать клавишу Enter для входа. Операторы if/else для недопустимых функций имени пользователя и пароля отлично. Но если я ввожу правильные учетные данные, он не загрузит местоположение (другая HTML-страница.)

PS: Я новичок в кодировании в целом (всего 3 недели). Попробуйте объяснить это так, чтобы новичок знал. Спасибо заранее.

<script type="text/javascript"> 
    function check_info(){ 
     var username = document.login.username.value; 
     var password = document.login.password.value; 

     if (username=="" || password=="") { 
      alert("Please fill in all fields") 
     } else { 
      if(username=="test") { 
       if (password=="test") { 
        location="Random.html" 
       } else { 
        alert("Invalid Password") 
       } 
      } else { 
       alert("Invalid Username") 
      } 
     } 
    } 
</script> 

<form name=login onsubmit="check_info()"> 
    Username: 
    <input type="text" name="username" id="username"/> 
    <br> 
    Password: 
    <input type="password" name="password" id="password"/> 
    <br> 
    <br> 
    <input type="submit" value="Login"/> 
</form> 

Answer 1

Две вещи:

- Proper way to simulate a clink on a link является использование изменить атрибут href из location, не location себя. Линия ниже должно работать:

window.location.href = "Random.html"; 

- Как вы перенаправляет на другую страницу, вы должны "подавить" (остановка) естественный onsubmit событие.

Другими словами, вы должны returnfalse на onsubmit события, в противном случае перенаправление (к Random.html) не будет иметь возможность работать, так как представить событие начнется в (и sedn пользователя на action странице форма) до перенаправления.

Меняем <form name=login onsubmit="check_info()"> к:

<form name=login onsubmit="return check_info()"> 

И добавить return false; к концу check_info().

Полный код должен выглядеть следующим образом:

<script type="text/javascript"> 
    function check_info(){ 
     var username = document.login.username.value; 
     var password = document.login.password.value; 

     if (username=="" || password=="") { 
      alert("Please fill in all fields") 
     } else { 
      if(username=="test") { 
       if (password=="test") { 
        window.location.href = "Random.html"; // ------ CHANGED THIS LINE 
       } else { 
        alert("Invalid Password") 
       } 
      } else { 
       alert("Invalid Username") 
      } 
     } 
     return false; // ------------------------ ADDED THIS LINE 
    } 
</script> 

И HTML (только onsubmit изменен):

<form name="login" onsubmit="return check_info()"> 
    Username: 
    <input type="text" name="username" id="username"/> 
    <br> 
    Password: 
    <input type="password" name="password" id="password"/> 
    <br> 
    <br> 
    <input type="submit" value="Login"/> 
</form> 

JSFiddle demo here.

Answer 2

Вы должны использовать .href на location

location.href = "Random.html"; 

(Кроме того, так как вы сказали, что вы были новые, не забудьте сохранить ваш Dev консоль (F12) открыт при написании JavaScript и тестирования - вы» Л.Л. поймать много ошибок в самом начале)

Answer 3

новый способ сделать это - установить контрольную точку на линии

if(username=="test") { 

И пройдите через него, чтобы найти, в чем проблема.

Старая школьная способ сделать это (от предыдущих до того, как у нас были отладчики Javascript) - предупредить сообщения в каждом из этих блоков и выяснить, почему вы вступаете в этот блок для начала. Это намного более громоздко, чем отладчик, но иногда вам, возможно, придется прибегнуть к старым школьным хакам.