2016-06-09 6 views
0

Я новичок в JavaScript и пытаюсь сравнить два поля ввода, прежде чем переходить на другую страницу. Цель состоит в том, что при нажатии кнопки текст из двух полей ввода сравнивается, а затем страница перенаправляется на другую страницу. Я пробовал использовать window.location.href, а также window.location.replace, но пока ничего не получилось. Перенаправление должно выполняться, потому что выполняется предупреждение в том же блоке логики. Спасибо за любую помощь.Проблема перенаправления на новую страницу в Javascript

<html> 

    <head> 
     <script type="text/javascript"> 
      function sub(){ 
       if(document.getElementById("p1").value == document.getElementById("p2").value){ 
        alert("success"); 
        window.location.replace="http://localhost:8080/newUser.php"; 
       } else { 
        alert("Password do not match"); 
       } 
      } 
     </script> 
    </head> 

<body> 
    <form onSubmit="sub()" method="post"> 
     Password: <input type="text" id="p1" name="password"><br> 
     Confirm Password: <input type="text" id="p2" name="passwordConfirm"><br> 
     <input type="submit"> 
    </form> 
</body> 

</html> 
+0

сценарий показывает предупреждение «успех»? –

+0

@JoseRojas yes –

+0

use 'document.location =" http: // localhost: 8080/newUser.php ";' – Teddy

ответ

1

Вот как вы можете это сделать. Вы должны вернуть false в своей функции, чтобы предотвратить публикацию вашей формы; теперь у вас есть onsubmit = "return sub();" в вашей форме.

<html> 
 

 
    <head> 
 
     <script type="text/javascript"> 
 
      function sub(){ 
 
       if(document.getElementById("p1").value == document.getElementById("p2").value){ 
 
        alert("success"); 
 
        window.location.href= "http://localhost:8080/newUser.php"; 
 
       } else { 
 
        alert("Password do not match"); 
 
       } 
 
\t \t return false; // IMPORTANT RETURN STATEMENT 
 
      } 
 
     </script> 
 
    </head> 
 

 
    <body> 
 
     <form onSubmit="return sub();" method=""> 
 
      Password: <input type="text" id="p1" name="password"><br> 
 
      Confirm Password: <input type="text" id="p2" name="passwordConfirm"><br> 
 
      <input type="submit"> 
 
     </form> 
 
    </body> 
 

 
</html>

Теперь, если вы хотите разместить набранные параметры (пароль и passwordConfirm) на этой странице, то @ ответ musicfuel является почти правильно, вы должны просто добавить onsubmit = "возвращение к югу(); " вместо onsubmit = "sub()"

+0

У меня возникли проблемы с получением параметров на странице newUser, когда я использую onSubmit = "return sub();" method = "post" action = "newUsers.php". Я пытаюсь получить доступ к переменной с помощью строки $ var = $ _POST ["password"]; –

+0

ну чувак, в чем проблема? – adar

0

Что сказал @Teddy правильно. Используйте либо document.location, либо document.location.href. Большая проблема заключается в том, что обработчик onSubmit вашей формы проходит после вашего вызова и выполняет POST на той же странице, на которой вы находитесь, вероятно, выглядит так, будто вы никуда не идете. Похоже, что ваш onSubmit предназначен для проверки правильности. Более традиционный способ сделать это состоит в следующем: действие

<html> 

<head> 
    <script type="text/javascript"> 
     function sub() { 
      if (document.getElementById("p1").value != document.getElementById("p2").value) { 
       return false; 
      } 
      alert("success"); 
      return true; 
     } 
    </script> 
</head> 

<body> 
    <form onSubmit="sub()" method="post" action="http://localhost:8080/newUser.php"> 
     Password: <input type="text" id="p1" name="password"><br> 
     Confirm Password: <input type="text" id="p2" name="passwordConfirm"> <br> 
     <input type="submit"> 
    </form> 
</body> 

</html> 

форме контролирует фактическое назначение на успех в нормальное поведение HTML. Функция onSubmit отвечает за возврат false при отказе проверки или истинном (или ничего в этом отношении) при успешном выполнении. Возврат false сообщает документу, что что-то не так, и предотвращает навигацию.

+0

Я просто запустил его с тем, что вы сказали, и он перенаправляет, несмотря ни на что. Хотя он возвращает false и должен помешать ему перейти на страницу php, он все равно все равно делает это. –

+0

У меня возникли проблемы с получением параметров на странице newUser.php, когда я использую onSubmit = "return sub();" method = "post" action = "newUsers.php". Я пытаюсь получить доступ к переменной с помощью строки $ var = $ _POST ["password"]; Где я иду не так? –

0

Использование window.location="http://localhost:8080/newUser.php"; должно быть достаточным для перенаправления. Вы уверены, что ваш путь верен? Т.е. есть ли дополнительные подкаталоги для включения в путь? window.location.replace="http://localhost:8080/folder/newUser.php";

+0

Да, они оба находятся в одной папке. Когда я изменяю onSubmit на action = "newUser.php", страница открывает файл php без проблем. Проблема в том, что я не могу проверить, соответствует ли текст, прежде чем он откроет этот файл. –

1

Вы отправляете форму и затем перезагружаете страницу. Хитрость заключается в том, чтобы предотвратить действие по умолчанию, например, так:

<form onSubmit="event.preventDefault(); sub();" method="post"> 
    Password: <input type="text" id="p1" name="password"><br> 
    Confirm Password: <input type="text" id="p2" name="passwordConfirm"><br> 
    <input type="submit"> 
</form> 

Примечание содержательная onSubmit атрибута:

event.preventDefault(); 

EDIT:

более тесно Думая об этом, хотя. Похоже, вы хотите реализовать какую-то проверку переднего конца, чтобы иметь возможность остановить действие формы, если пароли не совпадают. В этом случае я думаю, что лучшей идеей было бы отключить кнопку до тех пор, пока пароль не будет соответствовать, или что-то эквивалентное. Или просто запустите event.preventDefault(), если пароли не совпадают, и просто продолжайте публикацию формы, когда они соответствуют.

function sub(e){ 
    if(document.getElementById("p1").value !== document.getElementById("p2").value){ 
    e.preventDefault(); 
    alert("Password do not match"); 
    } 
} 

И форма так:

<form onSubmit="sub(event);" method="post" action="foo.php"> 
    Password: <input type="text" id="p1" name="password"><br> 
    Confirm Password: <input type="text" id="p2" name="passwordConfirm"><br> 
    <input type="submit"> 
</form> 
0

Самый простой способ заключается в использовании window.confirm(). Это похоже на alert(), но у него есть две кнопки: «ОК» и «Отмена». Он возвращает true, если пользователь нажал OK и возвращает false, если пользователь нажал «Отмена».

if (window.confirm('Success')) { 
      window.location.href='http://localhost:8080/newUser.php'; 
     }else{ 
      alert("Password do not match"); 
     } 
Смежные вопросы