停止表单提交

Posted

技术标签:

【中文标题】停止表单提交【英文标题】:Stop form submission 【发布时间】:2019-07-09 23:07:01 【问题描述】:

我有一个脚本,它显示带有文本输入和按钮的表单。 文本输入是必需的,但脚本仅验证输入是否为空/非空。

我需要更进一步,所以它只验证字母数字。

我无权访问处理表单提交/验证的文件,因为有 1000 多个文件。

如果输入字段不是字母数字,我尝试使用此脚本尝试。但它不起作用,表单仍然提交,无论输入如何。我对validate_text_field() 进行了彻底测试,并且运行良好。

<script>
    jQuery(document).ready(function() 
        function validate_text_field( input_txt_val )

            var letters = /^[0-9a-zA-Z]+$/;
            input_txt_val = $.trim( input_txt_val );
            if( input_txt_val.match(letters) )
                    return true;
            else
                    return false;
            

        

        jQuery(".asp_product_buy_btn_container .pricing-button").click(function(e)

            var input_txt_val = $( this ).closest( '.asp_all_buttons_container' ).siblings( 'form.asp-stripe-form' ).find( ".asp_product_custom_field_input" ).val();
            var is_valid = validate_text_field( input_txt_val );
            if( is_valid )
                alert('is valid alphanumeric');
                return true;
            else
                alert('is not valid alphanumeric');
                e.preventDefault()
                return false;
            

        );
    );
</script>

如何阻止提交此表单?

【问题讨论】:

我们需要帮助您调试的代码部分是您没有显示的部分; validate_text_field()。话虽如此,如果您搜索的话,已经有数千个关于将输入限制为字母数字值的问题。 您的代码与上述网页中的表单结合使用时效果很好。 jsfiddle.net/9nga0xtu 【参考方案1】:

preventDefault()` 无效时。事件处理程序的返回值可能无法正确处理。

jQuery(document).ready(function() 
   jQuery("#stripe_button_0").click(function(e)
      var is_valid = validate_text_field();
      if( is_valid )
         return true;
      else
         e.preventDefault()
         return false;
      
   );
);

【讨论】:

return false 实际上与preventDefault() 相同(尽管它也会停止事件传播)。如果这不起作用,那么preventDefault() 也不会。 不幸的是 preventDefault 也不起作用。如果我输入带有空格的字符串(不是字母数字),则表单正在提交并打开弹出窗口。请问还有什么想法吗?【参考方案2】:

在你的 URL 中,如果我调用 validate_text_field() 我会收到一个错误:

ReferenceError: validate_text_field is not defined

所以首先尝试解决这个问题。

两个提示: 您可以使用 $ 而不是 'jQuery'。 另外,这个片段:

var is_valid = validate_text_field();
  if( is_valid )
     return true;
  else
     return false;
  

可以简化为

return validate_text_field();

【讨论】:

你能再检查一下吗?我在我的开发服务器上有它,我上传了这个功能。有什么想法吗? 现在好像可以了,不是吗?我看到您添加的警报,它似乎验证良好

以上是关于停止表单提交的主要内容,如果未能解决你的问题,请参考以下文章

停止表单提交的 JavaScript 代码

停止表单提交的 JavaScript 代码

停止输入/返回键提交表单[重复]

Javascript - 根据ajax响应停止表单提交[重复]

在 codeigniter 中提交一次后,在每次刷新时停止表单提交

停止表单提交,使用 Jquery