[jQuery Mobile] jQuery Mobile中submit按钮提交后,其他元素DOM事件丢失

(1)现象:
引用jQuery Mobile,为页面中的一个button绑定事件,使用submit按钮提交表单。
结果,页面“看起来”像是刷新了,但是刷新后button按钮的事件丢失了。

例如:

<input type="submit" id="submit1" value="submit" />
<input type="button" id="button1" value="button" />
<script>
    $('#button1').click(function () {
        alert();
    });
</script>

(2)原因
查看网页的network发现,页面并没有刷新,而是由jQuery Mobile接管了表单的提交事件,用ajax来模拟进行了表单提交。
jQuery Moile取得ajax结果之后,删除并重新创建了原来的DOM,所以原来DOM之上的事件就丢失了。

(3)解决方法
使用form表单元素的原生submit方法来提交表单,
并且在submit按钮的click事件中返回false。

$('#submit1').click(function(){
    $('#form1')[0].submit();
    return false;
});
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1.JQuery 基础 改变web开发人员创造搞交互性界面的方式。设计者无需花费时间纠缠JS复杂的高级特性。 1....
    LaBaby_阅读 1,200评论 0 1
  • 1.JQuery 基础 改变web开发人员创造搞交互性界面的方式。设计者无需花费时间纠缠JS复杂的高级特性。 1....
    LaBaby_阅读 1,379评论 0 2
  • jQuery Mobile 构建手机 Web 网站介绍 jQuery Mobile 认知 jQueryMobile...
    birdflying阅读 1,281评论 0 1
  • 原文链接 http://blog.poetries.top/2016/10/20/review-jQuery 关注...
    前端进阶之旅阅读 16,679评论 18 503
  • JQuery Mobile(JQM、JQMobile) 你是否想知道为什么在 标签中 没有插入 type="te...
    aymincoder阅读 1,210评论 0 1