Проверьте форму с помощью плагина jQuery Validator, но запустите ее по ссылке

Question

Все, я пытаюсь использовать jQuery Form Validator (http://docs.jquery.com/Plugins/Validation). Однако я хотел бы иметь возможность щелкнуть ссылку, чтобы выполнить проверку, а затем отправить форму, если все в порядке. Кто-нибудь знает, как это сделать?сделать это? Любые советы или предложения будут с благодарностью.

Спасибо!

Answer 1

Вполне возможно.Плагин docs даже дает пример , который я немного изменил, чтобы отправить вместо оповещения:

$("#myform").validate();
$("a.check").click(function() {
  if ($("#myform").valid()) {
    $("#myform").submit();
  }
  return false;
});

Answer 2

Этот код будет работать так же, как принятый ответ, но со всей удаленной избыточностью. (Нет необходимости использовать .valid() для проверки формы, поскольку плагин Validate будет продолжать правильно блокировать недействительную форму.)

• Используйте event.preventDefault(), чтобы заблокировать поведение по умолчанию элемента привязки.

  $("#myform").validate();                // initialize plugin
  
  $("a#submit").on('click', function(e) { // capture the anchor link click
      e.preventDefault();                 // block default anchor link behaviors
      $("#myform").submit();              // simulates a submit button
  });
  

• Используйте href="#" в теге привязки.

  <a id="submit" href="#">Submit</a>
  

$(document).ready(function() {

  $("#myform").validate({ // initialize plugin
    submitHandler: function(form) { // simulate form submission for demo
      alert('form submission');
      return false;
    }
  });

  $("a#submit").on('click', function(e) { // capture the anchor link click
    e.preventDefault();                 // block default anchor link behaviors
    $("#myform").submit();              // simulates a submit button
  });

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.13.0/jquery.validate.js"></script>

<form id="myform">
  <input type="text" required="required" name="test1" />
  <br />
  <input type="text" required="required" name="test2" />
  <br />
  <a id="submit" href="#">Submit</a>
</form>