2010-02-11 18 views
15

मेरे पास अपनी पंक्तियों (<tr>) से जुड़ी क्लिक ईवेंट वाली एक तालिका है। <a> उन पंक्तियों के अंदर तत्व हैं जो उनके स्वयं के क्लिक ईवेंट असाइन किए गए हैं।Jquery क्लिक इवेंट प्रजनन

समस्या यह है कि, जब मैं <a> तत्व पर क्लिक करता हूं, तो यह माता-पिता <tr> से क्लिक ईवेंट को भी सक्रिय करता है। मुझे यह व्यवहार नहीं चाहिए; मैं सिर्फ <a> ईवेंट पर क्लिक करना चाहता हूं।

कोड:

// Event row TR 

$("tr:not(:first)").click(function() { 
    $(".window, .backFundo, .close").remove(); 

    var position = $(this).offset().top; 
    position = position < 0 ? 20 : position; 

    $("body").append($("<div></div>").addClass("backFundo")); 
    $("body").append($("<div></div>").addClass("window") 
     .html("<span class=close><img src=Images/close.png id=fechar /></span>") 
     .append("<span class=titulo>O que deseja fazer?</span>" 
       +"<span class=crud><a href=# id=edit>Editar</a></span>" 
       +"<span class=crud><a href=# id=delete codigo=" 
       + $(this).children("td:first").html() 
       + ">Excluir</a></span>") 
     .css({top:"20px"}) 
     .fadeIn("slow")); 

    $(document).scrollTop(0); 
}); 

// <A> Element event 

$("a").live("click",function() { alert("clicked!"); }); 

जब भी आप लंगर यह माता पिता पंक्ति से ईवेंट सक्रिय क्लिक करें। कोई विचार?

उत्तर

26

आपको ईवेंट बुलबुले को रोकना होगा। JQuery में आप इसे

e.stopPropagation(); 

एंकर टैग की ऑनक्लिक घटना में कर सकते हैं।

$("a").live("click",function(e){alert("clicked!");e.stopPropagation();}); 

संपादित

इस पोस्ट

jquery Event.stopPropagation() seems not to work

+0

कोई नहीं है। मैंने पहले ही यह कोशिश की है। कुछ नहीं होता है। – ozsenegal

+0

क्या आप अपना एचटीएमएल मार्कअप पोस्ट कर सकते हैं? – rahul

+0

मेरे पास एक सामान्य तालिका है। फिर मैं नए एंकर तत्वों को प्रचारित करता हूं, और उन पंक्तियों में संलग्न होता हूं। – ozsenegal

3

मैं दोनों <tr> और <a> के लिए bind बजाय live का प्रयोग करेंगे और निम्नलिखित कोड देखें

$("a").bind("click", function(e){ alert("clicked!"); e.stopPropagation() });

<a> के लिए

सभी <a href> की अपेक्षा के अनुसार काम करेगा और <tr> ईवेंट हैंडलर कोड <a> पर क्लिक करने के बाद निष्पादित नहीं होगा।

सभी आधुनिक ब्राउज़रों में काम करता है।

संबंधित मुद्दे