为什么.preventDefault()
在我的表单上不起作用,甚至alert()
?
<div id="popover-head" class="hide">Add new tab</div>
<div id="popover-content" class="hide">
<form class="form-inline" id="myForm" method="POST" action="../admin/FLT_add_tab.do">
<div class="form-group">
<!-- my form -->
<input type="text" name="newTab"/>
<button class="btn btn-primary" type="submit" ><i class="icon-white icon-ok"></i></button>
<button class="btn" type="button" onClick="popRemove();" ><i class="icon-remove"></i></button>
</div>
</form>
</div>
JS代码:
$(document).ready(function() {
$('#myForm').on('submit', function(e) {
alert("Thank you for your comment!" + e);
e.preventDefault();
});
});
我不知道我做错了什么。
更新:
具有popover的链接:
<li><a href="#" id="popover"><i class="icon-plus-sign"></i> Tab</a></li>
JS触发popover“
$('#popover').popover({
html : true,
title: function() {
return $("#popover-head").html();
},
content: function() {
return $("#popover-content").html();
}
});
jsfiddle:http://jsfiddle.net/9uYuH/
答案 0 :(得分:4)
由于动态生成bootstrap中的popover,因此应使用以下jquery函数
$(document).on('submit','#myform', function(e) {
alert("Thank you for your comment!" + e);
e.preventDefault();
});
答案 1 :(得分:2)
使用.on()
由于popstrap中的popover生成了动态元素,因此无法将事件直接绑定到它们。因此,您必须使用Event Delegation。
$(document).on('submit','#myform', function(e) {
alert("Thank you for your comment!" + e);
e.preventDefault();
});
或更好地使用
$('#popover').on('submit','#myform', function(e) {
alert("Thank you for your comment!" + e);
e.preventDefault();
});
语法
$( elements ).on( events, selector, data, handler );