0

Каким образом можно подключить внешний javascript файл к форме?

$(document).ready(function(){

  $('input[type="tel"]').inputmask('+7 (999) 999 99 99', {
    clearMaskOnLostFocus: true,
  });

  $('.js-form-validate').submit(function () {
    var form = $(this);
    var field = [];
    form.find('input[data-validate]').each(function () {
      field.push('input[data-validate]');
      var value = $(this).val(),
          line = $(this).closest('.some-form__line');
      for(var i=0;i<field.length;i++) {
        if( !value ) {
          line.addClass('some-form__line-required');
          setTimeout(function() {
            line.removeClass('some-form__line-required')
          }.bind(this),2000);
          event.preventDefault();
        }
      }
    });
  });
});
<div class="some-form">
  <form action="" method="" class="form js-form-validate">
    <div class="some-form__header title">Заголовок формы #1</div>

    <div class="some-form__line">
      <input type="text" name="name" placeholder="Ваше имя *" data-validate>
      <span class="some-form__hint">Обязательно для заполнения</span>
    </div>
    <div class="some-form__line">
      <input type="tel" name="phone" placeholder="Телефон *" data-validate>
      <span class="some-form__hint">Обязательно для заполнения</span>
    </div>
    <div class="some-form__line">
      <input type="email" name="mail" placeholder="E-mail">
    </div>

    <div class="some-form__submit">
      <input type="submit" value="Отправить" class="button button_submit button_wide">
    </div>
  </form>
</div>

4
  • в конце body обычно <script src="путь_к_скрипту"></script> например jQuery: <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> если скрипт свой то кроме src` ничего не надо` 2 мая 2019 в 19:52
  • Пробовал. Не запускается ) 2 мая 2019 в 19:53
  • Может что-то нужно указать в onsubmit? 2 мая 2019 в 19:53
  • а где вы подключаете inputmask? в коде не видно 2 мая 2019 в 21:21

1 ответ 1

0

$(document).ready(function(){

  $('input[type="tel"]').inputmask('+7 (999) 999 99 99', {
    clearMaskOnLostFocus: true,
  });

  $('.js-form-validate').submit(function () {
    var form = $(this);
    var field = [];
    form.find('input[data-validate]').each(function () {
      field.push('input[data-validate]');
      var value = $(this).val(),
          line = $(this).closest('.some-form__line');
      for(var i=0;i<field.length;i++) {
        if( !value ) {
          line.addClass('some-form__line-required');
          setTimeout(function() {
            line.removeClass('some-form__line-required')
          }.bind(this),2000);
          event.preventDefault();
        }
      }
    });
  });
});
<div class="some-form">
  <form action="" method="" class="form js-form-validate">
    <div class="some-form__header title">Заголовок формы #1</div>

    <div class="some-form__line">
      <input type="text" name="name" placeholder="Ваше имя *" data-validate>
      <span class="some-form__hint">Обязательно для заполнения</span>
    </div>
    <div class="some-form__line">
      <input type="tel" name="phone" placeholder="Телефон *" data-validate>
      <span class="some-form__hint">Обязательно для заполнения</span>
    </div>
    <div class="some-form__line">
      <input type="email" name="mail" placeholder="E-mail">
    </div>

    <div class="some-form__submit">
      <input type="submit" value="Отправить" class="button button_submit button_wide">
    </div>
  </form>
</div>

<script
  src="https://code.jquery.com/jquery-3.3.1.min.js"
  integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
  crossorigin="anonymous"></script>
  <script type='text/javascript' src="https://rawgit.com/RobinHerbots/jquery.inputmask/3.x/dist/jquery.inputmask.bundle.js"></script>

Ваш ответ

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

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