Question

我正在尝试验证表单提交上的表单元素，我已经为验证目的做了一个函数，它在元素模糊事件上运行正常，当我在表单提交中再次使用相同的函数时触发模糊事件以重新检查表单中的值如果没有错误，则调用内部提交的函数仅在第一次单击时起作用，但是当我更新字段中的值时，提交函数永远不会更新。

请帮帮我，这是我的代码

HTML：

 var re = /~^([\p{L}-\s']+)$~/i;    <----- Not working at all
     if (re.test(value) == true){ 
    // it passes regex
    }
else{
   // it does not
    }

JQUERY：

<form action="#" method="post" class="contact-form">
    <div class="form-gp">
      <textarea type="text" class="form-elem msg" placeholder="Type your message to the agent"></textarea>
    </div>
  <div class="form-gp">
    <input type="text" class="form-elem name" placeholder="First Name">
  </div>
  <div class="form-gp">
    <input type="text" class="form-elem phone" placeholder="Phone">
  </div>
  <input type="submit" class="btn btn-submit" value="Send">
</form>

实时代码 https://jsfiddle.net/logiccanvas/cLygrhrr/1/

Answer 1

我调试了您的代码，在每次点击发送按钮之前，您需要设置success = true，将success = true代码添加到您的js文件中，如下所示：

$('input[type="text"], textarea').on('blur', this, validator);


    $('.contact-form').submit('submit', function(){

    success = true;

    var elems = $(this).find('input[type="text"], textarea').blur(validator);
        elems.trigger('blur');

        if (success==true) {
                console.log('Form submitted successfully');
        } else {
                console.log("Form submission failure");
                return false;            
        } 
});

Answer 2

我认为在blur内触发submit事件是一个坏主意。您是否注意到每次单击“提交”按钮时显示了多少个控制台消息？这是我的想法中的一个更新的小提琴，试试这个

https://jsfiddle.net/26cyo83h/4/

在表单提交中调用的函数在第一次单击时获取更新的值，之后永远不会更新

2 个答案: