htmlタイトルのツールチップを使用したブートストラップポップアップ

クリックでトリガーされ、ホバー上に（ブートストラップ以外の）ツールチップがあるブートストラップポップオーバーを使用したいと思います。通常、これにはhtmlのtitle属性を使用します。しかし、ポップオーバーの初期化時に、ブートストラップはtitle属性の内容をdata-original-title属性に書き込み、titleを空の文字列に置き換えます。例えばhtmlタイトルのツールチップを使用したブートストラップポップアップ

これ：

<a href="#!" data-toggle="popover" data-title="This is the Popover's Title" data-placement="bottom" data-trigger="click" title="This is a Tooltip"> 
</a>

を初期化した後、このようになります。

<a data-original-title="This is a Tooltip" href="#!" data-toggle="popover" data-title="This is the Popover's Title" data-placement="bottom" data-trigger="click" title=""></a>

title属性が現在空であるので、何らツールチップが表示されません。

プレーンhtmlのポップオーバーアンカーにツールチップを表示する方法はありますか？

出典

2017-03-13 Jbartmann

こんにちは、あなたは、あなたの例のタイトルやコンテンツのための他のデータ属性を使用このチェックすることができます。fiddle

出典

2017-03-13 09:40:40 mcmac

おかげで

$('a').each(function() { $(this).popover({ content : $(this).attr("popover-content"), title : $(this).attr("popover-title"), placement : "right" }), $(this).tooltip({ title : $(this).attr("tooltip-title"), placement : "bottom" }) }); <a tooltip-title="This is a Tooltip" href="#!" popover-title="This is the Popover's Title" popover-content="popover content" data-trigger="click">click me</a>

例を、私はあなたが私の問題を誤解だと思います。 popoverのタイトルは大丈夫です。しかし、ブートストラップは 'title'属性を空文字列に置き換えるので、表示するツールチップはありません。あなたのソリューションは、ポップオーバーのタイトルとコンテンツの問題を最終的には修正しますが、ツールチップは修正しません。 – Jbartmann

今すぐ確認ツールチップも追加します。おそらく、この解決策が役立ちます。 – mcmac

htmlタイトルのツールチップを使用したブートストラップポップアップ

答えて

関連する問題