本篇文章主要介绍了bootstrap 模态框多次显示后台提交多次bug的解决方法，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
模态框
Bootstrap Modal
Bootstrap 的模态框使用Bootstrap 的前端应该都接触过。
本文记录一下今天使用时遇到的 BUG，以便以后查阅和帮助其他遇到同样问题的伙伴们。
BUG 情景
使用场景
触发展现模态框，填写对应的信息，然后 ajax 提交表单信息到后台。
简化
点击下面的按钮一次，弹出模态框。点击提交，会直接 alert("提交") 。点击一次会觉得很正常，但是如果你重复点几次模态框，会发现再次点击 提交 ，alert 会出现多次。
简书无法展现效果，可参见
ECTouch移动商城系统
下载
ECTouch是上海商创网络科技有限公司推出的一套基于 PHP 和 MySQL 数据库构建的开源且易于使用的移动商城网店系统！应用于各种服务器平台的高效、快速和易于管理的网店解决方案，采用稳定的MVC框架开发，完美对接ecshop系统与模板堂众多模板，为中小企业提供最佳的移动电商解决方案。ECTouch程序源代码完全无加密。安装时只需将已集成的文件夹放进指定位置，通过浏览器访问一键安装，无需对已有
代码如下：
Modal title
One fine body…
$(function() { $('#modal-click-error').on('click', function() { $('#myModal').modal('show'); $("#myModal .btn-primary").on('click', function() { alert("提交"); }); }); });
问题修复
上述的 js 代码，每次对于按钮的点击都会为提交按钮添加对应事件。修改如下即可：
$(function() {
$('#modal-click-error').on('click', function() {
$('#myModal').modal('show');
});
$("#myModal .btn-primary").on('click', function() {
alert("提交");
});
});上面是我整理给大家的，希望今后会对大家有帮助。
相关文章：
