एक क्लिक हैंडलर

Question

Here's a DEMO से mousedown/mouseup के प्रसार को रोकना।

मैं दो divs, एक आंतरिक और एक बाहरी है:

<div id="outer"> 
    <div id="inner"></div> 
</div> 

कुछ सीएसएस ताकि आप देख सकते हैं जो है जो के साथ:

#outer { 
    width: 250px; 
    height: 250px; 
    padding: 50px; 
    background: yellow; 
} 

#inner { 
    width: 250px; 
    height: 250px; 
    background: blue; 
} 

मैं mousedown और mouseup घटनाओं के प्रसार को रोकने की कोशिश click हैंडलर के भीतर से:

$('#inner').on('click', function(e) { 
    e.stopPropagation(); 
    $(this).css({'background': 'green'}); 
    return false; 
}); 

$('#outer').on('mousedown', function(e) { 
    $(this).css({'background': 'green'}); 
}); 

$('#outer').on('mouseup', function(e) { 
    $(this).css({'background': 'yellow'}); 
}); 

यह संभव नहीं लगता है। क्या काम अन्य mousedown और mouseup कॉल के भीतर से .stopPropagation बुला रहा है, के रूप में यहाँ (another DEMO) से पता चला है:

$('#inner').on('mousedown', function(e) { 
    e.stopPropagation(); 
    return false; 
}); 

$('#inner').on('mouseup', function(e) { 
    e.stopPropagation(); 
    return false; 
}); 

मैं हो सकता है पहले से ही अपने ही सवाल का जवाब दे दिया है, लेकिन मुझे यकीन है कि अगर मेरे दृष्टिकोण सबसे अच्छा है नहीं कर रहा हूँ । या सबसे उचित यह सही तरीके से एक mousedown और mouseup को खलबली मचाने वाले एक घटना को रोकने के लिए है

Answer 1

हाँ के बाद से माउस क्लिक और mousedown/mouseup अलग घटनाओं रहे हैं, तो आप बिल्कुल दूसरे से नहीं मिल सकता है?। - आपको इसे अपने स्वयं के मूसडाउन/माउसअप हैंडलर से करना है। आप क्या कर सकते हैं डू रिफैक्टर है कि दोनों जगहों पर उपयोग करने के लिए एक सामान्य विधि में:

stopPropagation('#inner', 'mousedown'); 
stopPropagation('#inner', 'mouseup'); 

function stopPropagation(id, event) { 
    $(id).on(event, function(e) { 
     e.stopPropagation(); 
     return false; 
    }); 
}