的onsubmit不会被触发
问题描述:
代码很简单:的onsubmit不会被触发
HTML:
<div class="modal dialog-add-category fade" role="dialog" aria-labelledby="dialogAddCategoryLabel">
<form onsubmit='alert("444")'>
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 id="dialogAddCategoryLabel" class="modal-title">Add a category</h4>
</div>
<div class="modal-body">
<input type="text" name="category_name" placeholder="Category name"/>
<div class="parent-category-tree"></div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
<button type="submit" class="btn btn-primary" data-dismiss="modal">Create</button>
</div>
</div>
</div>
</form>
</div>
JS:
$(function() {
$('.dialog-add-category').modal('show');
});
这里的真人版:http://jsfiddle.net/ygbhousz/1/
正如你所看到的,表单有onsubmit
事件,但它不会被触发。为什么会发生,我能做些什么来实现这些目标:
- Esc键和取消按钮应关闭模式
- 回车键提交按钮应提交表单(显示警报),然后关闭modal
?
答
请不要使用onsubmit,您在提交按钮上犯了错误,您应该删除data-dismiss="modal"
。再有就是召集关于提交事件没有功能,因此添加代码
$(document).on('click', '[type="submit"]', function() {
alert('444');
});
+0
好的。但我只是添加了'返回false';'并在处理结束后停止提交表单,现在它完美地工作。谢谢! – z2014 2014-09-06 19:15:32
+0
@ z2014你可以做一些类似“return confirm('For real?')”的提交或放弃表单,这取决于用户的反馈。 – 2014-12-18 18:53:32
它可能是引导正在吞噬其他事件。你有没有尝试过使用普通按钮并添加自定义提交功能?如果您希望该对话框关闭AFTER提交成功,那么无论如何您都需要更多的定制工作。 – 2014-09-06 17:20:24