#javascript #php #jquery
#javascript #php #jquery
Вопрос:
У меня возникли проблемы с переключением между моими формами регистрации и входа на страницу. Я не слишком знаком с JavaScript и jQuery, но это то, что я использую. Кстати, есть ли другой способ сделать это с помощью PHP?
Вот что у меня получилось. Моя форма входа отображается при загрузке страницы, а форма регистрации скрыта. Когда я нажимаю кнопку переключения, чтобы отобразить форму регистрации, ничего не происходит.
$("#toggle-login").click(function() {
$("#signup").hide().attr("formnovalidate");
$("#login").show();
});
$("#toggle-signup").click(function() {
$("#login").hide().attr("formnovalidate");
$("#signup").show();
});
$("document").ready(function() {
$("#signup").hide();
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-data text-center">
<h1 class="form-header">Header</h1>
<div id="login" class="main-login">
<form class="login-form" action="includes/login.inc.php" method="post">
<input name="mailuid" type="text" placeholder="Page Name"></input>
<br>
<input name="pwd" type="password" placeholder="Password"></input>
<br>
<button name="login-submit" type="submit">Login</button>
</form>
<p>Need to Create an account?</p>
<span class="btn btn-default" href="#" id="toggle-signup">Sign Up/span>
</div>
<div id="signup" class="main-signup text-center">
<form class="signup-form" action="includes/signup.inc.php" method="post">
<input name="pagename" type="text" placeholder="Page Name"></input>
<br>
<input name="pwd" type="password" placeholder="Password"></input>
<br>
<input name="pwd-repeat" type="password" placeholder="Repeat Password"></input>
<br>
<button name="login-submit" type="submit">Login</button>
</form>
<p>Already have an account?</p>
<span class="btn btn-default" href="#" id="toggle-login">Log In</span>
</div>
</div>
Комментарии:
1. Вы включили jQuery? Проверьте свою консоль на наличие ошибок? Я вставил ваш код во фрагмент, и, похоже, он работает нормально. Примечание сбоку, в
Sign Up/span>
есть небольшая опечатка (но это не вызвало бы вашей проблемы)2. это работает в «фрагменте запуска»
3. у меня ваш фрагмент кода работает нормально, вы просто пропустили закрытие диапазона после регистрации ‘Sign Up / span>’, но проблема не в этом.
Ответ №1:
Попробуйте переместить <script>
блок в нижнюю часть вашей страницы. В настоящее время вы пытаетесь подключить обработчики щелчков событий для DOM-элементов, которые отсутствуют в момент выполнения блока сценария.
В качестве альтернативы вы можете переместить обработчики кликов jQuery в jQuery('document').ready()
функцию, чтобы убедиться, что DOM готов к подключению обработчиков кликов.
Ответ №2:
Отложите ваш скрипт, чтобы он загружался после загрузки html
<script src="name_of_your_js_file" defer>
Комментарии:
1. Из MDN re:
defer
: «Этот атрибут не должен использоваться, если атрибут src отсутствует (т. Е. для встроенных скриптов), в этом случае это не имело бы никакого эффекта».2. Да, я просто предположил, что их JavaScript будет во внешнем файле.