jQueryイベントがトリガーされていません

Question

マークアップがあります。この部分はajaxを介してロードされ、div内に追加されています。ファイルuser-bar.phpの

内容：<script type="text/javascript" src="js/scripts.js"></script>

$(function(){ 
    loadUserBar(); 

    $('#notifications-list').live('click', function(){ 
     console.log('Test'); 
     $('#notifications-list .icon-comment').removeClass('new'); 
    }); 
}); 

function loadUserBar(){ 
    $('#user-area').load('php/user-bar.php', function(){ 
     initBootstrapElems(); //Initializing All popover elements 
    });  
} 

index.phpファイルとしてindex.phpファイルに含まれている以下のよう

<div id="u-bar"> 
    <ul id="u-nav" class="nav"> 
     <li id="notifications-list" class="dropdown" data-time="" > 
      <a href="#" class="dropdown-toggle" data-toggle="dropdown"> 
      <i class="icon-comment"></i> 
      Notifications 
      <b class="caret"></b> 
      </a> 
      <ul class="dropdown-menu" > 
       <li><a href="#">Notification One</a></li> 
       <li><a href="#">Notification two</a></li> 
       <li class="divider"></li> 
       <li><a href="#">Show All Notifications</a></li> 
      </ul> 
     </li> 
     <li class="dropdown"> 
     <a href="#" class="dropdown-toggle" data-toggle="dropdown"> 
      <i class="icon-user"></i> 
      Profile 
      <b class="caret"></b> 
     </a> 
     <ul class="dropdown-menu"> 
      <li><a href="#">View Profile</a></li> 
      <li><a href="#">Settings</a></li> 
     </ul> 
    </li> 
    <li><a href="php/logout.php">Logout</a></li> 
    <div class="clear"></div> 
    </ul> 
</div> 

私はscripts.jsファイルをしたが、AJAXは、マークアップがある返さdiv#user-areaを持っています挿入された。

ページ全体が読み込まれた後、リストアイテム#notifications-listをクリックすると、何も起こりません。しかし、$('#notifications-list').click()をコンソールに直接入力すると、ログが表示され、removeClassが発生します。

ここで間違っていますか？

Answer 1

そうだね、http://jsbin.com/ijiqec/2/editでシミュレートドロップダウンブートストラップとの競合が（あります）。何らかの理由で

問題を修正しに でライブの使用を変更する（なぜ私に聞かないでください）。 使用して、コードのこの作品：

$('#notifications-list').on('click',...

Answer 2

タグイベントにクリックするハンドラを配置してみます。

$('#notifications-list a').live('click', function(){ ... }) 

更新： すべてのliタグに同じIDを使用することはできません。 あなたは、各タグと上のJSを更新することを持っている場合は、クラスに李を変更するには＃通知リストが必要になります。

$('.notifications-list a').live('click', function(){ ... })