我有一个引导popover表单，它有几个输入文本字段和一个提交按钮。弹出窗口与输入文本字段一起显示得很好，但当单击提交按钮时，根本不会阻止默认操作。我也尝试过登录表单提交，但根本没有记录任何内容。我认为原因与popover以及它们最初是如何实现的有关。
<a href="#" id="popover" class="button blue">Create</a>
<div id="popover-head" class="hide"><h4>Create</h4></div>
<div id="popover-content" class="hide">
<form method="post">
<p><input type="text" id="name" name="name"></p>
<p><input type="text" id="tel" name="tel"></p>
<input type="submit" id="submit">
</form>
</div>
JQ:
$('#popover').popover({
html: true,
placement: 'right',
title: function () {
return $("#popover-head").html();
},
content: function () {
return $("#popover-content").html();
}
});
$('form').submit(function(){
alert('form submitted');
return false;
});
任何有明确想法的人都可以提供帮助。谢谢
原因是，您的.popover-content实际上被克隆并注入到<div>（即.popover本身）内的DOM中。因此，您的submit()永远不会绑定到popover中显示的表单，因为它是稍后添加的。如果您将事件绑定到document作为委托的事件处理程序，那么它也将使用.popover中显示的表单：
$(document).on('submit','form',function(){
alert('form submitted');
//prevent -> return false
return false;
});
演示->http://jsfiddle.net/r1q6qjpo/
注意：.hide已弃用：
.hide可用，但它并不总是影响屏幕阅读器和自v3.0.1起已弃用。只能使用.hidden或.sr。