ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

php – jQuery Mobile不会收听e.PreventDefault

2019-08-31 16:30:36  阅读:162  来源: 互联网

标签:javascript php jquery jquery-mobile


我想在主要脚本上请求有关jQuery Mobile插件冲突的帮助.我试图创建另一个版本的网站,这是一个移动版本与购买模板使用jQuery Mobile.该网站仍然是基于Web版本的CodeIgniter框架.

在我的主脚本中,我在每个表单提交上都有一个preventDefault()函数来显示验证错误.然后当我迁移我正在使用购买的移动模板的网站时,似乎不会听取preventDefault().每当我提交表单时,它都会显示验证错误,但会在我读取之前几秒钟更改页面.它刷新了网站.

我的脚本看起来像下面的代码.这适用于我的网络版. &GT&GT&GT

$('form#frm-signup-updates').submit(function(e){

    e.preventDefault();

    $.post(base_url+'home/subscribe', $('#frm-signup-updates').serialize(), function(data){

        if(data == 'success'){
            loadpopup();
        }
        else{
            var json = $.parseJSON(data);
            $("span.error-notif#name").append(json.name);
            $("span.error-notif#email").append(json.email);
        }

    });
});

解决方法:

尝试返回false以阻止提交.

$('form#frm-signup-updates').submit(function(e){

    $.post(base_url+'home/subscribe', $('#frm-signup-updates').serialize(), function(data){

        if(data == 'success'){
            loadpopup();
        }
        else{
            var json = $.parseJSON(data);
            $("span.error-notif#name").append(json.name);
            $("span.error-notif#email").append(json.email);
        }

    });
    return false;
});

更新:
好吧,我检查了jQuery Mobile的源代码,发现jQM默认阻止表单提交,并使用ajax处理.

        //bind to form submit events, handle with Ajax
        $.mobile.document.delegate("form", "submit", function(event) {
            var formData = getAjaxFormData($(this));

            if (formData) {
                $.mobile.changePage(formData.url, formData.options);
                event.preventDefault();
            }
        });

preventDefault无效,因为提交是由$.mobile.changePage而不是浏览器完成的.

所以,如果想阻止提交,那就是$.mobile.changePage,我有两个建议:

1.将’data-ajax = false’属性添加到表单元素

demo1

2.单击提交按钮时执行ajax

demo2

标签:javascript,php,jquery,jquery-mobile
来源: https://codeday.me/bug/20190831/1776799.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有