web-dev-qa-db-ja.com

特定の要素のjQuery UIツールチップをオフにする

簡単にするために、ページのすべての要素でjQuery UIツールチップウィジェットを有効にしたいと思います。

次に、特定の要素または要素とその子孫に対して無効にします。しかし、これはうまくいかないようです:

_$(document).tooltip({ track: true });
$('#menu *[title]').tooltip({ disabled: true });
_

私の$('#menu *[title]')セレクターは、#menu要素のtitle属性を持つすべての子孫要素を取得して、期待どおりに動作するようです。

では、これらの要素のツールチップを無効にするために.tooltip({ disabled: true });disabled オプションが機能しないのはなぜですか?これを達成する別の方法および/またはより良い方法はありますか?

21
slolife

以下を使用して、すべての要素にツールチップを設定します。

$('*').tooltip();

で無効にします

$('#menu *[title]').tooltip('disable');

アラ:

jsFiddle

28
Elliott

上記の答えはどれも私にとってはうまくいきませんでしたが、今これを行う方法は itemsオプション を使用することのようです

$("*").tooltip({ items: ':not(.menu)' });
10
Quails4Eva

そのどれも私にとってはうまくいきませんでした。

これは私のために働いたものです:

$(document).tooltip({ content: function () { return $(this).not('#NoTipDiv *[title]').attr('title'); });

$( '*')。tootipはページビューを大幅に遅延させる可能性があります!

3
Jason Gilley

$(document)の代わりにセレクターを使用する場合、適切なタイミングでそのコードを呼び出すことを忘れないでください。

$(document).tooltip({show: false});
$(document).ready( function(){
    $('#OK_Button').tooltip({disabled: true});
});
2
Andrei

私の回答日現在のjQueryUIドキュメントによると。

$( ".selector" ).tooltip( "option", "disabled", true );

0
Justin Skiles

おそらく$(':not(.menu *[title])').tooltip({ track: true });

0
cjc343

ASP.NET MVC Razorページでこれに苦労している人のために。これは、かみそりのヘルパーによるものです。以下を@ Html.EditorFor属性に追加する必要があります。

    autocomplete = "off"

以下は、これを行うフォームグループの例です。

<div class="form-group">
   @Html.LabelFor(model => model.Field, htmlAttributes: new { @class = "control-label col-md-2" })
   <div class="col-md-10">
      @Html.EditorFor(model => model.Field, new { htmlAttributes = new { @class = "form-control date-field", autocomplete = "off" } })
      @Html.ValidationMessageFor(model => model.Field, "", new { @class = "text-danger" })
   </div>
</div>
0
TsTeaTime

これが私が今していることです。

次のツールチップを表示:

  • クラス「noToolTip」を持つものはすべて除外します。
  • そして、これらを含めます:
    • TITLE属性を持つ要素。
    • ALT属性を持つIMG要素。
    • クラス「toolTip」およびTITLE属性を持つもの。

これが私のJavaScriptコードです。

// Set up tool tips for images and anchors.
$( document ).tooltip({
   items: "img[alt], a[title], .toolTip[title], :not(.noToolTip)",
   track: true,
   content: function() {
      var element = $( this );
      // noToolTip means NO TOOL TIP.
      if ( element.is( ".noToolTip" ) ) {
         return null;
      }
      // Anchor - use title.
      if ( element.is( "a[title]" ) ) {
         return element.attr( "title" );
      }
      // Image - use alt.
      if ( element.is( "img[alt]" ) ) {
         return element.attr( "alt" );
      }
      // Any element with toolTip class - use title.
      if ( element.is( ".toolTip[title]" ) ) {
         return element.attr( "title" );
      }
   }
});
0