12

Bootstrap のドキュメント ページでは、ツールチップに次の署名があります。

<a href="#" data-toggle="tooltip" title="first tooltip">hover over me</a>

このシナリオで "data-toggle" 属性は何をしますか?

タブに役立つことは知っていますが、ツールチップにどのような有用性をもたらすかわかりません。

クリス、

ツールチップは、次のように明示的に初期化する必要があります。

$(document).ready(function(){
    $(".link").tooltip();
});

「a」タグのクラスが「link」であると仮定します。ツールチップが正しく機能するために、「data-toggle」属性は必須ではありません。しかし、何かがツールチップかどうかを認識するのは、Bootstrap JavaScript ファイルのためだとおっしゃいました。したがって、「data-toggle」を省略してもツールチップが機能することは意味がないようです (明示的な初期化がある限り)。さらに説明していただけますか？

編集＃2：

GitHubの問題ページをいくつか読んだ後、次の結論に達したと思います（これが私の最善の推測です）。

もともと、Bootstrap の古いバージョンでは、ツールチップの署名は次のとおりでした。

<a href="#" rel="tooltip" title="first tooltip">hover over me</a>
...
<a href="#" rel="tooltip" title="first tooltip">hover over me again!</a>

そして、開発者は次のことができます:

$(document).ready(function(){
    $('[rel="tooltip"]').tooltip();
});

一度にすべてのツールチップをアクティブにするには (各ツールチップが機能するには初期化が必要なため)。つまり、jQuery を使用してすべてのツールチップをアクティブ化できるように、すべてのツールチップを特定する便利な方法でした。

しかし、rel="tooltip" は HTML5 に対して検証されませんでした。そのため、Bootstrap はすでに他のコンポーネントに data-toggle を使用しており、data-* は HTML5 で有効であるため、人々は data-toggle="tooltip" の使用を提案し始めました。

したがって、すべてのツールチップを識別する便利な方法を提供する以外に、 data-toggle="tooltip" に特別な意味や目的はないと思います。

ID またはクラスを使用してツールチップを識別することもできますが、一度にすべてのツールチップをアクティブにしないのはなぜでしょうか (修辞的な質問)。

4

3 に答える 3

15

GitHubの問題ページをいくつか読んだ後、次の結論に達したと思います（これが私の最善の推測です）。

もともと、Bootstrap の古いバージョンでは、ツールチップの署名は次のとおりでした。

<a href="#" rel="tooltip" title="first tooltip">hover over me</a>
...
<a href="#" rel="tooltip" title="first tooltip">hover over me again!</a>

そして、開発者は次のことができます:

$(document).ready(function(){
    $('[rel="tooltip"]').tooltip();
});

すべてのツールチップを一度にアクティブ化するには (各ツールチップが機能するには初期化が必要なため)。つまり、jQuery を使用してすべてのツールチップをアクティブにできるように、すべてのツールチップを特定する便利な方法でした。

しかし、rel="tooltip" は HTML5 に対して検証されませんでした。そのため、Bootstrap はすでに他のコンポーネントに data-toggle を使用しており、data-* は HTML5 で有効であるため、人々は data-toggle="tooltip" の使用を提案し始めました。

したがって、すべてのツールチップを識別する便利な方法を提供する以外に、 data-toggle="tooltip" に特別な意味や目的はないと思います。

ID またはクラスを使用してツールチップを識別することもできますが、一度にすべてのツールチップをアクティブにしないのはなぜでしょうか (修辞的な質問)。

于 2013-08-21T20:23:09.923 に答える
6

私はこれを使用します：

<script>
    $('[title]').tooltip();
</script>

属性タイトルが定義されているすべての要素を選択し、デフォルトのツールチップの動作をブートストラップされたものに置き換えます..

于 2014-08-28T01:33:25.913 に答える
1

data-toggle何かがツールチップである場合に、JavaScript でインジケーターとして使用することを選択しました。ツールチップ JS ファイルがdata-toggle="tooltip"属性を認識すると、起動して実行することがわかります。

より一般的なアプローチは、クラス ( <a href="#" class="tooltip" title="first tooltip">hover over me</a>)を使用することかもしれませんが、data-*代わりに属性を使用しています。同じことを行い、機能し、哲学的には、data-*属性は JavaScript 操作用に設計されているため、クラスを解放しておくのは良いことだと思います。

于 2013-06-22T22:04:28.030 に答える