ツールチップ内のonclickイベント

Question

私はHTMLコンテンツを持つtooltipsterを使用しており、HTMLコンテンツ内の要素のonclickをフックする必要があります。私のコードは次のようになります。

$('.groups-tooltip').tooltipster({    
     contentCloning: true, 
     trigger: 'custom', 
     interactive: true, 
     contentAsHTML: true, 
     triggerOpen: { 
      mouseenter: true 
     }, 
     triggerClose: { 
      mouseleave: true 
     }, 

     functionReady: function(instance, helper){ 
      $(".tooltip-template-div").hide(); 
      $('.tooltip-template-span').on("click", function(){ 
       console.log("Clicked!"); 
      }); 

      instance.content($('#tooltip-template').html()); 
     }  
    }); 

ツールチップテンプレートツールチップのテンプレートのdivとツールチップのテンプレートスパン elemntsのためだけのdivコンテナです。

$(".tooltip-template-div").hide(); 

部分がうまく機能しているが、onclickのフックは、任意の効果を持っていないようです。

ありがとうございます！

Answer 1

あなたはHTMLを挿入する前にイベントリスナーを追加している：

は順番に

functionReady: function(instance, helper){ 
     instance.content($('#tooltip-template').html()); 
     $(".tooltip-template-div").hide(); 
     $('.tooltip-template-span').on("click", function(){ 
      console.log("Clicked!"); 
     }); 

    } 

Answer 2

を逆にしてみてくださいあなたはtooltipsterを初期化する前に、クリックイベントをバインドする必要があります。あなたが実際にhttps://jsfiddle.net/8jmt0he6/