Подсказка JQuery (jQueryTool) ошибка нескольких экземпляров в таблице

Я использую всплывающую подсказку функции jQuery, разработанную «jquerytools» (http://jquerytools.org/download/), и пытаюсь вызвать несколько обратных вызовов для каждой строки первого столбца в таблице.

Это источник javascript:

$('#table1 tr td:nth-child(1)').each(function(){
    $(this).tooltip({
      bounce: "false",
      tip: $(this).children('.tableTooltip'),
      position: 'center right',
      offset: [0, 0],
      effect: "fade",
      relative: true,
      opacity: 1,
      delay: 300
    });
});

А это таблица:

<table id="table1">

  <tr><td> 
      Some content
      <div class="tooltip tableTooltip">
        <table><tr><td>My tooltip table</td></tr></table>
      </div>
  </td></tr>

  <tr><td> 
      Some other content
      <div class="tooltip tableTooltip">
        <table><tr><td>My other tooltip table</td></tr></table>
      </div>
  </td></tr>

</table>

Код вроде работает, и когда я навожу курсор на первый столбец основной таблицы, появляется всплывающая подсказка. Но когда я навожу курсор на всплывающую подсказку, я получаю эту ошибку от Firebug:

неперехваченное исключение: не удается найти всплывающую подсказку для [object Object]

Кто-нибудь может мне помочь? Любые подсказки действительно ценятся!


jquery tooltip jquery-tools jquery-tooltip
person Danilo    schedule 10.01.2013    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Это может иметь какое-то отношение к инициализации, так как я заметил, что всплывающие подсказки активируются только после наведения курсора мыши. Я внес некоторые изменения, чтобы устранить любые проблемы во время инициализации, скрыв всплывающую подсказку, а также изменив всплывающую подсказку, чтобы не использовать таблицу, которая также могла быть выбрана вашим селектором jquery.

http://jsbin.com/ewagex/4 ‹- протестируйте здесь http://jsbin.com/ewagex/4/edit ‹ — редактировать здесь

  <table id="table1">

  <tr><td> 
      Some content
      <div class="tooltip tableTooltip">
        <div>My tooltip table</div>
      </div>
  </td></tr>

  <tr><td> 
      Some other content
      <div class="tooltip tableTooltip">
        <div>My other tooltip table</div>
      </div>
  </td></tr>

  <script>
    $('#table1 tr td:nth-child(1)').each(function(){
    $(this).children('.tableTooltip').hide();
    $(this).tooltip({
      bounce: "false",
      tip: $(this).children('.tableTooltip'),
      position: 'center right',
      offset: [0, 0],
      effect: "fade",
      relative: true,
      opacity: 1,
      delay: 300
    });
});
    </script>
person michaelt    schedule 10.01.2013