ブートストラップのツールチップに問題があります。ボタンをクリックすると、カーソルがボタンの外にあってもツールチップがそのまま残ります。私はマニュアルを見ている - Bootstrap's tooltipと私はボタンをクリックしている場合、私は同じ問題を参照してください。これを解決する解決策はありますか?最新のFF、IEで試してみました。ボタンをクリックして&mouseleaveした後にブートストラップのツールチップが消えない
答えて
trigger
が設定されていないためです。トリガーのデフォルト値は'hover focus'
であるため、ボタンがクリックされると、ボタンがクリックされるまでツールチップが表示され続けます。これは、ボタンがfocused
であるためです。
trigger
を'hover'
として定義するだけです。あなたはボタンがクリックされた後にツールチップを持続させずにリンクされている同じ例下:
$('[data-toggle="tooltip"]').tooltip({
trigger : 'hover'
})
ドキュメントの例フィドルで - >http://jsfiddle.net/vdzvvg6o/
ダビデに感謝します。私は最後にツールチップのトリガーオプションを誤解しましたが、今私は正しいです。 – SilentCry
@ SilentCryターゲットを絞っている人を覚えておいてください。「ホバー」を誘発することは必ずしも容易ではないかもしれません。 – phk
@phk - あなたは、あなたが何を意味するのか、覚えているのかの例を挙げることができますか? – davidkonrad
私の場合は問題はInternet Explorerのみで再現されました:どの要素(入力、divなど)にツールチップがある場合でも、クリックした場合はツールチップが表示されたままです。
は、要素上のツールチップがevent-をクリック.hide()を推奨していますウェブ上でいくつかの解決策を見つけたが、それは同じ要素に戻ってホバリング悪いidea-である - それは私の場合は...隠された を保つ$('.myToolTippedElement').on('click', function() {
$(this).blur()
})
すべての魔法を作りました! - .myToolTippedElementは、ツールヒントを持つ要素です...
私のためにも動作し、ツールチップにフォーカスを置いたままにしておけば解決できないという利点があります。 –
私は1年以上前から知っていますが、ここではどのような例でも動作させることができませんでした。私は以下を使用しなければなりませんでした:
$('[rel="tooltip"]').on('click', function() {
$(this).tooltip('hide')
})
これはまた、ホバー上でツールチップを再び表示します。
これは受け入れられる回答でなければならず、またブートストラップコードベースに実装する必要があります。 – kjdion84
これは、非同期ポストバック(つまりモーダルパネルの表示)を引き起こす「ホバー」のトリガーを持つボタンに配置されたブートストラップのツールチップに非常に役立ちました。これがなければ、ボタンを押してポストバックするとツールチップが「固まって」消えることはありません。 – bradykey
私の場合、Ajaxアクションが実行されている間は、送信ボタンを無効にしていました。 ajaxプロセスが実行されている間、ボタンが無効になってからツールチップが残っていました。 Ajaxプロセスが完了すると、ボタンは再び「使用可能」になります。ボタンをオン/オフすると、ツールチップが閉じられます。 Nitaiのソリューションはすべてを修正しました。ツールチップはクリック時に非表示になり、ボタンが再度アクティブになると、ツールチップはホバー上で動作します。 – HPWD
私のケースではdata-toggle="tooltip"
の代わりにrel="tooltip"
を試してみてください。私はdata-toggle="tooltip"
を使用していて、私の場合は動作しなかったホバーとしてトリガ条件を設定しました。私がデータセレクタを変更したとき、それは機能しました。
HTMLコード:
<button id="submit-btn" type="submit" class="btn btn-success" rel="tooltip" title="Click to submit this form">Submit</button>
JSコード //ツールチップ$( 'BTN。')ツールチップ({ トリガー 'ホバー' })。
これは間違いなく止まったツールチップを削除します。
上記のDavidの回答は私の問題を解決するのに役立ちました。 私は、ボタン上でホバーイベントとクリックイベントの両方を持っていました。 MACのFirefoxは、私が望むように動作しました。つまり、カーソルを置いたときにツールチップを表示し、クリックのためにツールチップを表示しない。 他のブラウザとOSでは、をクリックすると、ツールチップが表示され、表示されたままになります。私がホバーのために他のボタンにマウスを移動したとしても。 これは私が持っていたものです:
$('[data-toggle="tooltip"]').tooltip({placement: 'right', html: true, trigger: 'hover'});
それは私のために働いた! – b1919676
こんにちは、私はこの問題のために少しのソリューションを持っている:
$('[data-toggle="tooltip"]').tooltip({placement: 'right', html: true});
これは修正です。他のソリューションがうまくいかない場合は、次のように試してください:
これはドラッグアンドドロップの解決策です。 私はこれが誰かを助けることを願っています:)
私はcycle.jsでブートストラップツールチップを使用していますが、上記のどれも私のために働いていません。
私はこれをしなければならなかった:
return button(selector + '.btn.btn-sm',
{
hook: {
destroy: tooltipOff,
insert: toggleTooltipOn,
},
....
function toggleTooltipOn(vnode){
setupJQuery();
jQuery[0].$(vnode.elm)
.tooltip({container:'body', trigger: 'hover');
//container:body is to help tooltips not wiggle on hover
//trigger:hover is to only trigger on hover, not on click
}
function tooltipOff(vnode){
setupJQuery();
jQuery[0].$(vnode.elm).tooltip('hide');
}
これは私の作品:
$(document).ready(function() {
$('#save').tooltip({
trigger : 'hover'
}) ;
});
私は問題が動的に、ボタン保存して無効にされました。
ここでsaveは私のボタンのIDです –
- 1. クリックしてもツールチップのオーバーレイが消えない
- 2. Android - すぐにクリックした後にボタンのクリック音が消える
- 3. ボタンをクリックした後のページからフォームが消えて送信
- 4. 商品のクリックでJqueryのツールチップが消えない
- 5. HTML/TS:別のテキストエリアを作成した後、またはボタンをクリックした後にtextarea textContentが消える
- 6. マウスアウト時にツールチップが消えない
- 7. FacebookのXFBML Likeボタンが消えた後に消える
- 8. ユーザーがボタンをクリックする数秒後にモーダルダイアログが消える
- 9. ツールチップが点滅して消える
- 10. 「行を追加」ボタンをクリックした後、リピーターからデータが消える
- 11. クリックしたときにスクロールが途中で消えるボタン
- 12. ajaxの後にブートストラップのツールチップが動作しない
- 13. ブートストラップ3:他をクリックするとnavbarドロップダウンメニューが消えない
- 14. テキストボックスをクリックした後にdivの内容が消えたい場合
- 15. ボタンをクリックしてブートストラップのフリップカラムをクリックしてください
- 16. ボタンがクリックされていないときにツールチップを表示
- 17. ブートストラップドロップダウン - クリック後に消える
- 18. ボタンをクリックした後にAjax POSTが機能しない
- 19. ブートストラップがツールチップを表示しない
- 20. jQueryのツールチップ遅れ/ Iが正しく消えていないツールチップを持っている
- 21. Twitterのブートストラップ:モーダルポップアップが消えない
- 22. MozillaでESCを押したときにツールチップが消える
- 23. ボタンがクリックされた後、グリッドビューのデータから値が消えます
- 24. Chart.js - アニメーション後にグラフが消える[ブートストラップJsのため]
- 25. ボタンのテキストが消えました
- 26. ボタンをクリックしてフォーカスを外した後にイベントが発生しない
- 27. ブートストラップ - ボタンをクリックした後でのみポストバック後にモーダルを開くC#
- 28. ボタンをクリックした後に別のボタンをクリックします。
- 29. 投稿後にボタンが消える
- 30. アニメーション後にボタンが消える
「修正する解決策はありますか?」 - 私は確信していますが、問題は実際には、あなたのコードを見ることによってのみ知ることができます。動作していないコードを入力してください。 – davidkonrad
私の質問でリンクでは機能しません。見てみましょう。同じ問題があります。 – SilentCry