1

私の Qtip コンテンツは動的で、そのコンテンツは要素が動的にバインドされる div に設定されています。バインドはコンテンツの取得後に行われるため、Qtip コンテンツは表示されません。

 <td><a href="#" id="qtipselector_01" data-bind="text: title, loadqtip: true"></a>
          <div id="TooltipContent_01" class="hidden">
            <a data-bind="text: title"></a>                 
          </div>
  </td>

コンテンツに $(element).next().html() を使用していますが、html が割り当てられたときにまだレンダリングされません。

 ko.bindingHandlers.loadqtip = {
        init: function(element, valueAccessor) {
                $(element).qtip({
                    content: $(element).next().html(),
                    position: {
                        my: 'left center', 
                        at: 'center right'
                    },
                    show: 'mouseenter',
                        hide: {
                            fixed: true,
                            delay: 500,

                            when: {
                                event: 'unfocus'
                            }
                        },
                    style: {
                        tip: {
                          width: 20,
                          height: 14,
                        },
                        width:280,
                        height:100,    
                        classes: 'qtip-light qtip-shadow qtip-rounded',

                    }
                });
        }
    };

jsFiddle の例: http://jsfiddle.net/adi85/kq44S/1/

4

0 に答える 0