8

他の誰かがここでこの質問をしましたが、答えも解決策もありませんでした。

これらのブートストラップ ファイルは、私の application.js ファイルの先頭にリストされています。

...
//= require bootstrap-tooltip
//= require bootstrap-popover
...

私のbootstrap_additions.js.coffeeファイルには以下が含まれています：

$("a[rel=popover]").popover()
$(".tooltip").tooltip()
$("a[rel=tooltip]").tooltip()

私が持っているビューで：

<a href="#" class="btn" rel="popover" title="Title" data-content="Some content.">click</a>

ブラウザに localhost:3000/assets/application.js と入力すると、bootstrap-popover.js コンテンツが表示されます。さらに、次のことがわかりました。

jQuery(function() {
    $("a[rel=popover]").popover().on('click', preventDefault());
    $(".tooltip").tooltip();
    return $("a[rel=tooltip]").tooltip();
});

リンクをクリックすると、ブラウザの表示がページの上部に移動します。下にスクロールしてリンクに戻ると、ポップオーバーが表示されます。preventDefault 以外はすべて動作しています。私は何が欠けていますか？

ありがとう。

更新:コードをきれいに保つために、選択した回答のcoffeescriptバージョンを見つけました:

$("a[rel=popover]").popover().click (e) => e.preventDefault()
4

4 に答える 4

15

次のようにチェーンすることもできます。

$("a[rel=popover]")
  .on('click',function(e){
    e.preventDefault();
  })
  .popover();
于 2014-02-13T16:30:41.617 に答える
15

Twitter ブートストラップ ポップオーバーの使用

Coffeescript に含まれるように更新

最初のアプローチ

インスタンス化

$("a[rel=popover]").popover()

扱う

$("a[rel=popover]").click (event) ->
  event.preventDefault()
  event.stopPropagation()
  $(this).popover "show"

2番目のアプローチ

ソースコードから直接取得：

$("a[rel=popover]").popover().click (e) ->
  e.preventDefault()
于 2012-11-14T05:22:39.767 に答える
9

You can use a 'span' tag instead of an 'a' tag so that you don't need to preventDefault.

also prevent default should be associated with an event.

http://api.jquery.com/event.preventDefault/

于 2012-11-14T05:23:32.727 に答える
0

まず、TontonBlach の回答に感謝したいと思います。

しかし、なぜこの単純な機能が機能しないのか疑問に思い、(W3 学校ではなく) https://getbootstrap.com/docs/3.3/javascript/#popoversの公式マニュアルを読んだところ、正しいと思われるものが見つかりました。答え。

  1. まず、href タグがないこと

  2. クロスブラウザーおよびクロスプラットフォームで適切に動作させるには、aタグではなくタグをbutton使用する必要があり、role="button" および tabindex 属性も含める必要があります。

それを修正したのは、彼らの（動作中の）例をコピーし、違いに注意することでした（私にとっては、tabindexがなかったことです）。role="button" はアクセシビリティに関係しているため、技術的には必須ではないことにも注意してください。

これにより、デフォルトの関数を正しく使用し.popover()てポップオーバーを開始できます。

于 2017-09-28T08:50:34.430 に答える