twitter-bootstrap bootstrap popover preventDefault for click 在 Rails 3.2 应用程序中不起作用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/13373357/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
bootstrap popover preventDefault for click is not working in a Rails 3.2 app
提问by Jay
Someone else asked this question here, but there was no answer or solution given.
其他人在这里问了这个问题，但没有给出答案或解决方案。
These bootstrap files are listed at the top of my application.js file:
这些引导文件列在我的 application.js 文件的顶部：
...
//= require bootstrap-tooltip
//= require bootstrap-popover
...
My bootstrap_additions.js.coffee file contains:
我的 bootstrap_additions.js.coffee 文件包含：
$("a[rel=popover]").popover()
$(".tooltip").tooltip()
$("a[rel=tooltip]").tooltip()
In a view I have:
在我看来：
<a href="#" class="btn" rel="popover" title="Title" data-content="Some content.">click</a>
When i enter localhost:3000/assets/application.js in the browser, the bootstrap-popover.js content is present. In addition i found the following:
当我在浏览器中输入 localhost:3000/assets/application.js 时，就会出现 bootstrap-popover.js 内容。此外，我发现以下内容：
jQuery(function() {
$("a[rel=popover]").popover().on('click', preventDefault());
$(".tooltip").tooltip();
return $("a[rel=tooltip]").tooltip();
});
When the link is clicked the browser display is moved to the top of the page. When I scroll back down to the link, the popover is displayed. All is working except preventDefault. What am I missing?
单击链接时，浏览器显示将移至页面顶部。当我向下滚动到链接时，会显示弹出窗口。除了 preventDefault 之外，一切都在工作。我错过了什么？
Thanks.
谢谢。
UPDATE: To keep things clean in my code, i found the coffeescript versionof the selected answer:
更新：为了在我的代码中保持干净，我找到了所选答案的coffeescript 版本：
$("a[rel=popover]").popover().click (e) => e.preventDefault()
回答by TontonBlach
You can also chain as this :
你也可以这样链接：
$("a[rel=popover]")
.on('click',function(e){
e.preventDefault();
})
.popover();
回答by EasyCo
Using Twitter Bootstrap Popover
Updated to be in Coffeescript
更新为 Coffeescript
1st approach
第一种方法
Instantiate
实例化
$("a[rel=popover]").popover()
Handle
处理
$("a[rel=popover]").click (event) ->
event.preventDefault()
event.stopPropagation()
$(this).popover "show"
2nd approach
第二种方法
Taken directly from their source code:
直接取自他们的源代码：
$("a[rel=popover]").popover().click (e) ->
e.preventDefault()
回答by Kubee
You can use a 'span' tag instead of an 'a' tag so that you don't need to preventDefault.
您可以使用“span”标签而不是“a”标签，这样您就不需要阻止默认值。
also prevent default should be associated with an event.
还防止默认应与事件相关联。
回答by Antony
Firstly I want to thank TontonBlach for his answer because it greatly helped me.
首先我要感谢 TontonBlach 的回答，因为它极大地帮助了我。
I wondered however why this simple feature wasn't working and having read the official manual (as opposed to W3 schools) at https://getbootstrap.com/docs/3.3/javascript/#popoversI have found what I believe is the correct answer.
然而，我想知道为什么这个简单的功能不起作用，并且在https://getbootstrap.com/docs/3.3/javascript/#popovers上阅读了官方手册（而不是 W3 学校）我发现我认为是正确的回答。
- Firstly there should be no href tag
For proper cross-browser and cross-platform behavior, you must use the
atag, not thebuttontag, and you also must include the role="button" and tabindex attributes
- 首先应该没有href标签
对于正确的跨浏览器和跨平台行为，您必须使用
a标签，而不是button标签，并且还必须包含 role="button" 和 tabindex 属性
What fixed it was copying their (working) example and noting the differences (which for me was the absence of tabindex). Also worth noting that role="button" is to do with accessibility and so not technicallyrequired.
修复它的是复制他们的（工作）示例并注意差异（对我来说是没有 tabindex）。还值得注意的是 role="button" 与可访问性有关，因此在技术上不需要。
With this in place you can then correctly use the default .popover()function to initiate the popovers.
有了这个，您就可以正确使用默认.popover()功能来启动弹出窗口。
