W2UI：パネル内にロードされたコンテンツのクリックやその他のイベントが機能しない

Question

私はw2ui 1.5-rc1レイアウトコンポーネントを使用しています。 は、アクションをトリガしませんパネル内部の要素にイベントハンドラをアタッチ：アイテムベラまたはカール上

<script> 
    $(function() { 
     $('#layout').w2layout({ 
      name: 'mainArea', 
      panels: [ 
       { type: 'left', size: 200, resizable: true, style: panels, content: 'left' }, 
       { type: 'main', style: main, content: 'main' } 
      ] 
     }); 
     w2ui['mainArea'].content('main', $("#list-panel").html()); 

     $("#mylist li a").click(function() { 
      alert("Handler for .click() called."); 
     }); 
    }) 
</script> 
<div id="layout"></div> 
<div id="list-panel" style="visibility: hidden" > 
    <ul id="mylist" class="list-group"> 
     <li><a href="#" onclick="alert('This one will work')"><span>Adele</span></a></li> 
     <li><a href="#"><span>Bella</span></a></li> 
     <li><a href="#"><span>Carl</span></a></li> 
    </ul> 
</div> 

クリックすると、アラートをトリガーすることはありません。 w2uiレイアウトを削除すると、すべてが機能します。

<script> 
    $(function() { 
     $("#mylist li a").click(function() { 
      alert("Handler for .click() called."); 
     }); 
    }) 
</script> 
<div id="list-panel" > 
    <ul id="mylist" class="list-group"> 
     <li><a href="#" onclick="alert('This one will work')"><span>Adele</span></a></li> 
     <li><a href="#"><span>Bella</span></a></li> 
     <li><a href="#"><span>Carl</span></a></li> 
    </ul> 
</div> 

パネル内にブートストラップコンポーネントやその他のコンテンツを追加しようとすると同じことが起こりました。これらのコンポーネントのクリック、変更、その他のイベントは決してトリガーされません。

理由は何ですか？

Answer 1

w2ui githubリポジトリ内の他のユーザーが推奨するように、イベントをドキュメント要素に添付すると機能します。

$(document).on("click", "#mylist li a", function() { 
    alert("Handler for .click() called"); 
});