функция () не реагирует на отправку формы

0

довести его до такой степени: моя функция ничего не говорит мне, когда я отправляю форму. URL изменяется, но похоже, что функция не запускается. Пожалуйста помоги!

<div id="contact_form">  
<form name="contact" action="">  
  <fieldset>  
    <label for="name" id="name_label">Name</label>  
    <input type="text" name="name" id="name" size="30" value="" class="text-input" />  
    <label class="error" for="name" id="name_error">This field is required.</label>  

    <label for="email" id="email_label">Return Email</label>  
    <input type="text" name="email" id="email" size="30" value="" class="text-input" />  
    <label class="error" for="email" id="email_error">This field is required.</label>  

    <label for="phone" id="phone_label">Return Phone</label>  
    <input type="text" name="phone" id="phone" size="30" value="" class="text-input" />  
    <label class="error" for="phone" id="phone_error">This field is required.</label>  

    <br />  
    <input type="submit" name="submit" class="button" id="submit_btn" value="Send" />  
  </fieldset>  
</form>  
</div>  
<script>
    $(function() {  
  $('.error').hide();  
  $(".button").click(function() {  
    // validate and process form here  

    $('.error').hide();  
      var name = $("input#name").val();  
        if (name == "") {  
      $("label#name_error").show();  
      $("input#name").focus();  
      return false;  
    }  
        var email = $("input#email").val();  
        if (email == "") {  
      $("label#email_error").show();  
      $("input#email").focus();  
      return false;  
    }  
        var phone = $("input#phone").val();  
        if (phone == "") {  
      $("label#phone_error").show();  
      $("input#phone").focus();  
      return false;  
    }  

  });  
});  
</script>

Заранее спасибо!

PS: Искал его уже в google, но не нашел хорошего результата.

Теги:
forms
submit

2 ответа

0

Используй это:

$('form[name="contact"]').on('submit', function() {

    $('.error').hide();  
    var name = $("input#name").val();  

    if (name.length == 0) {  
      $("label#name_error").show();  
      $("input#name").focus();  
      return false;  
    }  

    var email = $("input#email").val();  
    if (email.length == 0) {  
      $("label#email_error").show();  
      $("input#email").focus();  
      return false;  
    }  

    var phone = $("input#phone").val();  
    if (phone.length == 0) {  
      $("label#phone_error").show();  
      $("input#phone").focus();  
      return false;  
    } 

    return true; 
});
  • 0
    Он использует jQuery ... так зачем onSubmit ? Просто используйте $('form[name="contact"]').on('submit', function() { ....
  • 0
    Вам не нужно публиковать несколько ответов ... нормально иметь один и редактировать его по мере необходимости.
Показать ещё 2 комментария
0

Сначала добавьте параметр события в обработчик нажатия кнопки, например:

$(".button").click(function(e)){

Затем также измените

return false;

к

e.preventDefault();

РЕДАКТИРОВАТЬ:

Этот код работает для меня. Когда вы нажимаете кнопку с пустыми полями, форма не отправляется и отображается текст ошибки рядом с первым полем. Кстати, здесь нет php, просто html и jquery. Вы загружаете jquery на свою страницу?

<div id="contact_form">  
<form name="contact" action="">  
  <fieldset>  
    <label for="name" id="name_label">Name</label>  
    <input type="text" name="name" id="name" size="30" value="" class="text-input" />  
    <label class="error" for="name" id="name_error">This field is required.</label>  

    <label for="email" id="email_label">Return Email</label>  
    <input type="text" name="email" id="email" size="30" value="" class="text-input" />  
    <label class="error" for="email" id="email_error">This field is required.</label>  

    <label for="phone" id="phone_label">Return Phone</label>  
    <input type="text" name="phone" id="phone" size="30" value="" class="text-input" />  
    <label class="error" for="phone" id="phone_error">This field is required.</label>  

    <br />  
   <input type="submit" name="submit" class="button" id="submit_btn" value="Send" />  
  </fieldset>  
</form>  
</div>  
<script>
$(function() {  
  $('.error').hide();  
  $(".button").click(function(e) {  
  // validate and process form here  

  $('.error').hide();  
    var name = $("input#name").val();  
    if (name == "") {  
      $("label#name_error").show();  
      $("input#name").focus();  
      e.preventDefault();  
      return;
   }  
    var email = $("input#email").val();  
    if (email == "") {  
  $("label#email_error").show();  
  $("input#email").focus();
  e.preventDefault();  
  return;
}  
    var phone = $("input#phone").val();  
    if (phone == "") {  
  $("label#phone_error").show();  
  $("input#phone").focus();
  e.preventDefault();  
  return;  
}  

});  
});  
</script>
  • 0
    Пробовал, ничего не изменилось: /
  • 0
    Мой сервер поддерживает JQuery, но это не работает для меня: C я думаю, что я делаю что-то совершенно неправильно. Сообщение «это поле обязательно для заполнения» появляется только после загрузки страницы и не исчезает, когда я заполняю свою электронную почту и нажимаю на кнопку отправить: /
Показать ещё 2 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню