2

Код не работает нигде - console.log не срабатывает внутри функции.

В чём ошибка?

$( "#form-login" ).submit(function( event ) {
    console.log('here');
    alert( "Handler for .submit() called." );
    event.preventDefault();
});
<script src="https://code.jquery.com/jquery-2.2.4.min.js"
    integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="
    crossorigin="anonymous">
</script>

<form id="form-login" method="post">
    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
        <input class="mdl-textfield__input" name='login' type="email" id="login">
        <label class="mdl-textfield__label" for="login">Логин</label>
    </div>

    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
        <input class="mdl-textfield__input" name='password' type="password" id="password">
        <label class="mdl-textfield__label" for="password">Пароль</label>
    </div>

    <div class="mdl-card__actions">
        <button type="submit" class="mdl-button mdl-js-button
            mdl-button--raised mdl-js-ripple-effect mdl-button--accent buttons-login">Вход
        </button>
    </div>
</form>
3
  • сниппет в вопросе работает - выводится и в консоль и алерт, в чем проблема?
    – Grundy
    2 июл 2016 в 11:33
  • mybeer.info - исходный код. Не работает. 2 июл 2016 в 11:36
  • весь необходимый код должен быть непосредственно в вопросе, посмотрите как создать минимальный воспроизводимый пример
    – Grundy
    2 июл 2016 в 11:52

1 ответ 1

2

При правке заметил один лишний </div>, в то время как в другом месте его не хватало. После правки кода всё заработало

$( "#form-login" ).submit(function( event ) {
    console.log('here');
    alert( "Handler for .submit() called." );
    event.preventDefault();
});
<script src="https://code.jquery.com/jquery-2.2.4.min.js"
    integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="
    crossorigin="anonymous">
</script>

<form id="form-login" method="post">
    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
        <input class="mdl-textfield__input" name='login' type="email" id="login">
        <label class="mdl-textfield__label" for="login">Логин</label>
    </div>

    <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
        <input class="mdl-textfield__input" name='password' type="password"
            id="password">
        <label class="mdl-textfield__label" for="password">Пароль</label>
    </div>

    <div class="mdl-card__actions">
        <button type="submit" class="mdl-button mdl-js-button mdl-button--raised
            mdl-js-ripple-effect mdl-button--accent buttons-login">Вход
        </button>
    </div>
</form>


Вы указали ссылку mybeer.info
Там не работает jquery, потому что нет $(document).ready

<script>$(document).ready(function() { ... });</script>
7
  • Спасибо, смогу - проверю. Проблема в том, что до этого в теге формы был onsubmit="" и все работало... Неожиданная проблема:( 2 июл 2016 в 11:38
  • Уточню: в хроме - будет. а в других браузерах нет.. Из-за чего и началась эпопея)) 2 июл 2016 в 11:39
  • уточните пожалуйста, почему jquery код НЕ будет работать не в пределах этой обёртки? В моём понимании она просто откладывает выполнение js до момента полной прогрузки страницы. Или не так? Просто хочется понять раз и навсегда) 2 июл 2016 в 19:25
  • 1
    @VyacheslavPotseluyko, не обязательно использовать ready, он для работы при загрузки DOM. Если скрипт загружен в конце html документа, можно использовать $(function() { ... }
    – Doofy
    2 июл 2016 в 19:44
  • Еще раз спасибо) 2 июл 2016 в 21:14

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.