41

には属性がないため (Bootstrap の Web サイトの例では を使用した例が 1 つしか示されてinputいません)、これがまったく可能であるとは 100% 確信が持てませんが、動作するはずだと思います。relrel="tooltip"

これは私のHTMLです：

<input id="password" type="password" />

そして、これは私がそれをトリガーしようとする方法です:

$(document).ready(function () {

    $('input[id=password]').tooltip({'trigger':'focus'});
});

そして、私もこれを試しました：

$('#password').tooltip({'trigger':'focus'});

そして、それらのどれも機能していないようです。最終的には手動でトリガーしたいのですが、これが最初のステップです。誰かがこれに対する解決策を知っていますか? それはまったく可能ですか？ありがとう。

4

6 に答える 6

75

ツールチップに「title」パラメータを指定してみてください。お気に入り：

$('#password').tooltip({'trigger':'focus', 'title': 'Password tooltip'});

ところで、それは「rel」属性を持つ入力要素に問題はありません。

于 2012-04-29T12:12:42.150 に答える
13

すべてのテキスト ボックスのより一般的なツールチップ オプションを知りたい場合に備えて

$(document).ready(function() {
  $('input[rel="txtTooltip"]').tooltip();
});
<link href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<input type="text" rel="txtTooltip" title="**Your Title**" data-toggle="tooltip" data-placement="bottom">

于 2014-03-20T23:37:38.957 に答える
4

ブーストラップ 3 および 4

@Senthil の応答に基づいて、ブートストラップ 3.x または 4.x と JQuery を使用titleすると、属性を必要とせずにプロパティが設定されている限り、すべての入力要素にツールチップが設定されrelます。

HTML:

<input class="form-control" id="inputTestID" name="inputTest" placeholder="Test" type="text" data-placement="bottom" title="Tooltip Text">

Javascript:

$(document).ready(function(){
  $('input').tooltip();
});

CSS:

.tooltip-inner {
  background-color: #fff; 
  color: #000;
  border: 1px solid #000;
}
于 2017-10-11T13:16:13.783 に答える
3

これは、複数の入力フィールドがある場合に役立つ可能性があるため、複数の tooltip() を呼び出すことはありません。

これを行うだけです。これは入力フィールドのIDに基づいています。クラスとしても機能させることができます。

$('input').each(function (i, e) {
    var label;
    switch ($(e).attr('id')) {
        case 'input-one':
            label = 'This is input #1';
            break;
        case 'input-two':
            label = 'This is input #2';
            break;
    }
    $(e).tooltip({ 'trigger': 'focus', 'title': label });
});

それが役に立てば幸い ：）

于 2015-04-28T09:37:58.603 に答える