javascript - 为div附加点击事件

Question

美好的一天，我想通过 BIND 方法将 click 方法附加到 div。我的附加代码是

$("#brend_list > #mCSB_1 > .mCSB_container > div > a").bind('click',function(){
id=$(this).attr('id');
ttl=$(this).parent().children("span").html();
state=$(this).hasClass("checked");

if(state) {$(this).removeClass("checked");
$("#"+id+"_filter").remove();
}
else{$(this).addClass("checked");


$("#filters").append(" <div style='display:inline-block;' id='"+id+"_filter' class='filter_brands' onclick='brend_uncheck(\""+id+"\"); $(this).remove();'><span>"+ttl+"</span><b>x</b></div> ");


}});

我的div结构是

<div id="brend_list" class="mCustomScrollbar _mCS_1">
  <div class="mCustomScrollBox mCS-light" id="mCSB_1" style="position:relative; height:100%; overflow:hidden; max-width:100%;">
   <div class="mCSB_container" style="position: relative; top: 0px;">
    <div><a id="filt_brend001"></a><span>Loreal Paris</span></div><!-- this <a> -->
    <div><a id="filt_brend002"></a><span>Laura Mercier</span></div>
    ...........
    </div>
    <div class="mCSB_scrollTools" style="position: absolute; display: block;">
      <div class="mCSB_draggerContainer"><div class="mCSB_dragger" style="position: absolute; height: 110px; top: 0px;" oncontextmenu="return false;">
        <div class="mCSB_dragger_bar" style="position: relative; line-height: 110px;">  
        </div>
      </div>
      <div class="mCSB_draggerRail">
      </div>
     </div>
    </div>
   </div>
</div>

但它没有附加。

Answer 1

你要么改变

$("#brend_list > #mCSB_1 > .mCSB_container > div > a")

到

$("#brend_list > #mCSB_1 > .mCSB_container > div > a + span")

上面的 fiddle 是here .

或者，将 HTML 更改为

<div><a id="filt_brend001"></a><span>Loreal Paris</span></div>

到

<div><a id="filt_brend001"><span>Loreal Paris</span></a></div>

上面的操作是 here .