我有这样的按钮
<form action="/category" method='GET'> <button type="submit" class="btn btn-default render"> name </button> </form>
并且我有一些javascript,每当按钮被点击时启动一个模态…这只是让用户知道下一页正在加载.
<script type='text/javascript'> $(document).ready(function(){ $(".render").click(function(evt){ $('#render_page').modal('show'); }); }); </script>
这是模态的html
<div class="modal fade" id="render_page" role="dialog"> <div class="modal-dialog"> <div class="modal-content"> <div class="form-horizontal"> <div class="modal-body"> <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> <div id="user_msg" align="left">Rendering Page... </div> </div> </div> </div> </div> </div>
这一切在Firefox和Chrome上都可以正常工作,但是Safari不会显示模态?如果我把表单放在按钮中,它将启动模态,但它不会提交表单.所以这两个方面,表单提交和模式都可以做,但是safari不想这样做?
解决方法
尝试这个
<script type='text/javascript'> $(document).ready(function(){ $(".render").click(function(evt){ evt.preventDefault(); $('#render_page').modal('show'); }); }); </script>
https://jsfiddle.net/y64qyjzo/
$(document).ready(function() { $(".render").click(function(evt) { evt.preventDefault(); $('#render_page').modal('show'); setTimeout(function() { $('#testForm').submit(); },1000) }); });
(将id’testForm’添加到表单中)