单击父级及其子级jquery的事件

Question

我的tr有一个表格msgdetails。在tr.msgdetails内，我有sel_checkbox类的复选框。我有两个{{1}的点击事件我需要单独处理它。如果单击tr element and checkbox，则复选框的事件应该有效，如果单击checkbox而不是复选框，则另一个应该有效。

我的HTML就是这样。

tr

我的jquery是这样的：

<tr class="msgdetails even" role="row">
  <td width="20%">
    <div class="checkbox_div">
      <input  class="sel_checkbox" type="checkbox">
    </div>
  </td>
  <td>some other data</td>
  <td>some  data</td>
</tr>

这种方法有效但不能完美运作。请帮助我

Answer 1

代码段 ------------

JSFiddle

<强> HTML

<div>

<table>
    <tr  class="msgdetails even" role="row">
   <td width="20%">
      <div class="checkbox_div">
           <input  class="sel_checkbox" type="checkbox">
      </div>
  </td>
  <td>some other data</td>
  <td>some  data      </td>
 </tr>
 </table>

</div>

的js

$(document).ready(function() {
    $("tr.msgdetails").click(function(e){
    if(e.target.type==="checkbox"){
    var selCheckBox=$(e.target);
    if(selCheckBox.hasClass('sel_checkbox')){

          if($(selCheckBox).prop("checked")){
             alert('checked checbox'); 
            }
            else{
            alert('checkbox Unchecked');
            }
        }
    }else{
        /*if you dont want checkbox column row outside clicking to be disabled then*/
        var selCheckBox=$(e.target);
            var chk=$(selCheckBox).children().hasClass("sel_checkbox");
            if(chk){
                return false;
            }
      else{
                alert('tr clicked');
            }
    }


   });
});