JQM (jQueryMobile) HTML5 模式验证与备用按钮类型(不提交)

发布于 2024-11-01 17:53:03 字数 1019 浏览 1 评论 0原文

使用 HTML5 模式进行表单字段验证,如果表单无效,如何停止提交?也许我应该问,如何创建自定义有效/无效表单处理程序?

有关changePage()

$('#form-submit-button').click( function() {
    event.preventDefault(); // This is undefined                    

        // This submits my form and values via ajax, handles page transition
    $.mobile.changePage({
        url: 'request.php?page=one', 
        type: 'post', 
        data: $('form#test_form').serialize()
    },'slide',false,false);
}); 

示例的文档 HTML 表单字段

<input type="text" 
       name="first_name" 
       id="first_name" 
       placeholder="First Name*" 
       pattern="[\w .-]" 
       required />

示例HTML 按钮(非提交类型)

<input type="button" 
       data-theme="z" 
       data-icon="forward" 
       data-inline="true" 
       name="form-submit-button" 
       id="form-submit-button" 
       value="Next Step"/>

Using HTML5 Pattern for form field validation, how does one stop a submission if the form is invalid? Maybe I should ask, how does one create a custom valid/invalid form handler?

Documentation on the changePage()

$('#form-submit-button').click( function() {
    event.preventDefault(); // This is undefined                    

        // This submits my form and values via ajax, handles page transition
    $.mobile.changePage({
        url: 'request.php?page=one', 
        type: 'post', 
        data: $('form#test_form').serialize()
    },'slide',false,false);
}); 

Example HTML Form Field

<input type="text" 
       name="first_name" 
       id="first_name" 
       placeholder="First Name*" 
       pattern="[\w .-]" 
       required />

Example HTML Button (Not Submit type)

<input type="button" 
       data-theme="z" 
       data-icon="forward" 
       data-inline="true" 
       name="form-submit-button" 
       id="form-submit-button" 
       value="Next Step"/>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

瑾兮 2024-11-08 17:53:03

http://marxsoftware.blogspot.com/2011/01/html5 -form-field-validation.html

据此,在验证之前它不应该让您提交表单。

http://marxsoftware.blogspot.com/2011/01/html5-form-field-validation.html

According to this, it shouldn't let you submit your form till it validates.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文