1

私は* * のように頭が悪いと思いますが、title 属性を指定しないと動作しません。これが私のコードです:

$('.js-client-info').popover({html : true, title: "ZOMG", content:"asdasdasdasdasdasd"});

動作していません

$('.js-client-info').tooltip({html : true, title: "ZOMG", content:"asdasdasdasdasdasd"});

動作していません

以下をレンダリングします。

<a class="js-client-info" data-original-title="" title="">gg</a>

マークアップにタイトル属性を配置すると、すべて正常に機能します。しかし、コンテンツ プロパティを使用して、ajax 呼び出しで情報を読み込みたいです。お願い助けて。

機能しないということは、次のことを意味します。

  • コード $('.js-client-info').tooltip('show') で呼び出しても、ポップアップは表示されません
4

2 に答える 2

1

jQuery UI ツールチップのデフォルト機能はケーキのようにシンプルです :D

基本的なjQuery:

$(function() {
 $('.js-client-info').tooltip();
});

イベントなどへの追加については、これを行います

 $(function() {
   $('.js-client-info').tooltip({
     show: {
    effect: "slideDown",
    delay: 250
  },
    hide: {
     effect: "slideUp",
   }
     });
 });

カスタム コンテンツは次のとおりです。

http://jsbin.com/uwuwuk/1/edit

$(function() {
   $('.tip').tooltip({
     show: {
    effect: "slideDown",
    delay: 250
  },
    hide: {
     effect: "slideUp"
   },
     items: "[title], [data-html]",//call the attr inside square brackets
     content: function() {
     var element = $( this );
       var call = $(this).attr('data-html'); //var call is same as items though we need to do this
      var randHTML = {a:'<div class="red"></div>',b:'<div class="blue"></div>'};//array of html (technically objects)
    if ( element.is("[data-html]") ) {
      return randHTML[call]; //if element is data-html return the randHTML with which attr it has (a, b, c, d)
    }
    if ( element.is("[title]") ) { //if just title return title
      return element.attr( "title" );
    }
 }
   });
 });
于 2013-05-22T18:35:25.390 に答える
1

http://jsfiddle.net/nzgdv/2/

itemsオプションを指定することで問題が解決しました。

jquery UI ツールチップが行うことは、ブラウザのデフォルト ツールチップを置き換えることです。

したがって、プロパティを持たないアイテムでは自動的に機能しないと思いtitleます (これにより、デフォルトのツールチップが表示されます)。

これはドキュメントにもあります:

アイテムとコンテンツ オプションは常に同期している必要があります。どちらかを変更する場合は、もう一方を変更する必要があります。

于 2013-05-22T18:57:41.993 に答える