9

数秒後に Boostrap ツールチップを自動的に非表示にしたい。

 <input type="text" title="" data-placement="bottom" style="width:200px" data-toggle="tooltip" autocomplete="off" data-provide="typeahead" class="form-control Waring" name="medicine_name" id="medicine_name" data-original-title="Please Enter Valid medicine name">
4

10 に答える 10

22

すべてのブートストラップ ツールチップでページ全体の自動非表示にこれを使用します。

$(function () {
   $(document).on('shown.bs.tooltip', function (e) {
      setTimeout(function () {
        $(e.target).tooltip('hide');
      }, 10000);
   });
});
于 2015-09-22T10:55:21.857 に答える
4

これを試して

$('#element').on('shown.bs.tooltip', function () {
   setTimeout(function () {
    $('#element').tooltip('destroy');
   }, 2000);
})
于 2014-08-01T08:24:04.927 に答える
3

jsfiddle

ブートストラップ 4 でさえこの機能が組み込まれていない理由がわかりません。とにかく

HTML

<button class="btn" data-toggle="tooltip" title="helloworld" data-trigger="click" type="button">click</button>

JS

$(document).on('show.bs.tooltip', function (e) {
  if ($(e.target).data('trigger') == 'click') {
    var timeoutDataName = 'shownBsTooltipTimeout';
    if ($(e.target).data(timeoutDataName) != null) {
      clearTimeout($(e.target).data(timeoutDataName));
    }
    var timeout = setTimeout(function () {
      $(e.target).click();
    }, 5000);
    $(e.target).data(timeoutDataName, timeout);
  }
});

$(document).on('hide.bs.tooltip', function (e) {
  if ($(e.target).data('trigger') == 'click') {
    var timeoutDataName = 'shownBsTooltipTimeout';
    if ($(e.target).data(timeoutDataName) != null) {
      clearTimeout($(e.target).data(timeoutDataName));
    }
  }
});
于 2016-01-21T03:24:25.090 に答える
0

これが簡単な答えです

$(selector).tooltip({title:"Event", trigger:"focus or hover only", delay:{hide:800}});

遅延オプションで非表示パラメーターのみを指定します。

クリックイベントで動作しない理由がわかりません.....

しかし、フォーカス（クリックのタブ）とホバーイベントでは正常に動作します!!

于 2016-08-04T02:38:13.147 に答える