अभिभावक के क्लिक ईवेंट से उप-आइटम को कैसे बाहर निकालना है?

Question

मुझे कोई समस्या है जहां एक तालिका पंक्ति में एक क्लिक ईवेंट होता है, लेकिन जब कोई उपयोगकर्ता तालिका पंक्ति की कोशिकाओं में से किसी एक लिंक पर क्लिक करता है तो मैं नहीं चाहता कि पंक्ति की क्लिक ईवेंट आग लग जाए।

ऐसी स्थिति की कल्पना करें जहां एक टेबल सेल के भीतर एक लिंक है और आम तौर पर किसी भी तालिका पंक्तियों (उदा। लिंक नहीं) के खाली क्षेत्रों पर क्लिक करने से एग्रीजन/पंक्ति पतन और विस्तार जैसे कुछ क्रियाएं होती हैं।

क्या हो रहा है कि नीचे क्लिक करें घटना तो फायरिंग लिंक पीछा किया जाता है (अभिप्रेत कार्रवाई) किया जाता है।

मुझे क्या करना है, यह है कि tr.title-row क्लिक एक्शन (जैसे अलर्ट आग नहीं लगाना चाहिए और लिंक का पालन किया जाना चाहिए) को ट्रिगर करने से एक href के क्लिक को बाहर करना है।

:

इस jQuery कोड (जैसे सभी वें उस पंक्ति में है, किसी भी कोशिकाओं, आदि)

$(document).ready(function() { 
$(".report tr.title-row").click(function() { 
    alert('I am firing!'); 
}); 

यहाँ एक ही HTML इस पर लागू होता है है शीर्षक पंक्ति के लिए क्लिक ईवेंट स्थापित कर रही है

<table width="100%" cellspacing="0" cellpadding="0" border="0" class="report"> 
    <tbody> 
    <tr class="title-row"> 
     <th width="340"><span class="title">Test</span> 
     </th> 
     <th width="130" class="center-cell">Test</th> 
     <th width="90" class="status"></th> 
     <th></th> 
     <th width="160"> <a target="_self" href="http://www.google.com" class="link-class sub-class">I am triggering the TR click event</a> 
     </th> 
    </tr> 
    <tr> 
     <td class="sub-row" colspan="5"> 
     <table width="100%" cellspacing="0" cellpadding="0" border="0"> 
      <tbody> 
      <tr> 
       <td><strong>SubRow</strong> 
       </td> 
       <td width="90" class="status"><span class="sub">Sub</span> 
       </td> 
       <td width="120"></td> 
       <td width="160"><a title="Continue" href="http://www.yahoo.com">Something</a> 
       </td> 
      </tr> 
      </tbody> 
     </table> 
     </td> 
    </tr> 
    </tbody> 
</table> 

Answer 1

के बजाय +०४५४७९३२१० पंक्ति क्लिक करें और केवल रन कोड की target जांच कर सकता है अगर लक्ष्य एक <a> टैग नहीं है:

$(".report tr.title-row").click(function(event) { 

    if(! $(event.target).is('a')){ 
     alert('I only fire when A not clicked!'); 
    } 
}); 

Answer 2

बस सिर्फका उपयोग बेहतर कोड के लिए पंक्ति

$(".report tr.title-row").click(function() { 
    alert('I am firing!'); 
}); 

$(".report tr.title-row a").click(function(ev){ 
    // link clicked 
    // so something 

    ev.stopPropagation(); // stop triggering the event to the table row 
}); 

btw ... करने के लिए घटना बुदबुदाती रोक नामित eventhandler

$(".report tr.title-row").on('click', function() { 
    alert('I am firing!'); 
}); 

$(".report tr.title-row a").('click', function(ev){ 
    // link clicked 
    // so something 

    ev.stopPropagation(); // stop triggering the event to the table row 
});