您可以在一种形式上同时运行JavaScript和jQuery脚本吗?

时间:2020-05-24 14:22:31

标签: html jquery

我正在尝试运行内置HTML / CSS的表单,并且我的JavaScript有效,但对jQuery不起作用。 我的JavaScript可以正常运行,但jQuery不能。我试图取出JavaScript,但是仍然无法正常工作。 我想从我的jQuery提供以下代码:

$(function() {
  $("#name_error_message").hide();
  $("#email_error_message").hide();
  $("#query_error_message").hide();
  var error_name = false;
  var error_email = false;
  var error_query = false;
  $("#name").focusout(function() {
    check_name();
  });
  $("#email").focusout(function() {
    check_email();
  });
  $("#query").focusout(function() {
    check_query();
  });

  function check_name() {
    var pattern = /^[a-zA-Z]*$/;
    var name = $("#name").val()
    if (pattern.test(name) && name !== '') {
      $("#name_error_message").hide();
      $("#name").css("border-bottom", "3px solid #00FF00");
    } else {
      $("#name_error_message").html("Only characters allowed");
      $("#name_error_message").show();
      $("#name").css("border-bottom", "3px solid #FF4500");
      error_name = true;
    }
  }

  function check_email() {
    var pattern = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
    var email = $("#email").val()
    if (pattern.test(email) && email !== '') {
      $("#email_error_message").hide();
      $("#email").css("border-bottom", "3px solid #00FF00");
    } else {
      $("#email_error_message").html("Email address not valid");
      $("#email_error_message").show();
      $("#email").css("border-bottom", "3px solid #FF4500");
      error_email = true;
    }
  }

  function check_query() {
    var query = $("textarea#query").val()
    if (query !== '') {

      $("textarea#query_error_message").hide();
      $("textarea#query").css("border-bottom", "3px solid #00FF00");

    } else {
      $("textarea#query_error_message").html("Your query is not filled in");
      $("textarea#query_error_message").show();
      $("textarea#query").css("border-bottom", "3px solid #FF4500");
      error_query = true;
    }
  }
  //button submit checks 
  $("#contactform").Submit(function() {
    error_name = false;
    error_email = false;
    error_query = false;
    check_name();
    check_email();
    check_query();
    if (error_name === false && error_email === false && error_query === false) {
      alert("Thanks for your query - we will be back to you shortly");
      return true;
    } else {
      alert("Your form seems to be incorrectly filled - please review");
      return false;
    }
  });

});

我不确定这里有什么问题-感谢您的帮助。

0 个答案:

没有答案