Javascript чтение старых параметров из URL (метод GET)
Я начинаю изучать JavaScript (из С++, Java, Python) и столкнулся со следующей проблемой. Я хочу создать простую страницу входа и передать такие параметры, как имя пользователя и ppassword. С методом POST все работает. Тем не менее, я хотел попробовать метод GET, в котором параметры будут помещены в URL-адрес, просто чтобы увидеть разницу. Проблема в том, что функция JS всегда считывает старые значения, поэтому в начале, после того как я нажимаю «Отправить», она считывает значение null как для имени пользователя, так и для пароля (поскольку начальная ссылка не имеет никаких параметров), а позже она всегда читает старые. Похоже, что URL-адрес не обновляется до запуска JS-скрипта.
Любая идея о том, как решить эту проблему?
function validate() {
var queryString = window.location.href;
var url = new URL(queryString);
var username = url.searchParams.get('username')
var password = url.searchParams.get('password')
console.info(username);
console.info(password);
if (username == "admin" && password == "admin") {
alert("login successfully");
} else {
alert("login failed");
}
}<form class = "box" action = "login.html" method = "GET">
<input type = "text" name = "username" placeholder = "Enter your username" id = "username">
<br>
<input type = "password" name = "password" placeholder = "Enter your password" id = "password">
<br>
<input type = "submit" name = "" value = "Login" onclick = "validate()">
</form>
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Разделите код на два файла, один для home.html, который содержит элементы пользовательского интерфейса, а отправка формы передаст данные в другой файл login.html. Кроме того, удаление события клика, поскольку оно уже находится в форме типа отправки, автоматически отправит данные в login.html, указанные в действии отправки.
Логин.html
<script>
var queryString = window.location.href;
var url = new URL(queryString);
var username = url.searchParams.get("username");
var password = url.searchParams.get("password");
console.info(username);
console.info(password);
if (username == "admin" && password == "admin") {
alert("login successfully");
} else {
alert("login failed");
}
</script>
home.html
<form class = "box" action = "login.html" method = "GET">
<input type = "text" name = "username" placeholder = "Enter your username" id = "username">
<br>
<input type = "password" name = "password" placeholder = "Enter your password" id = "password">
<br>
<input type = "submit" name = "" value = "Login">
</form>
Здесь вы отправляете форму на login.html и вызываете проверку по клику, поэтому происходят противоречивые действия. Это не решит вашу проблему.