2011-09-15 28 views
5

चेकबॉक्स इनपुट के लिए एक क्लिक ईवेंट पर बाध्यकारी होने पर, मेरे ईवेंट हैंडलर के समय तक चेकबॉक्स पहले से ही टॉगल किया जाता है और, और अजीब बात यह है कि अगर मैं event.preventDefault() निर्दिष्ट करता हूं तो मेरे ईवेंट हैंडलर चलाने के बाद टॉगल उलट दिया जाता है;क्या यह चेकबॉक्स इनपुट, या त्रुटिपूर्ण कोड पर डिफ़ॉल्ट क्लिक ईवेंट की मूल गलतफहमी है?

<input id="foo" type="checkbox"/> 

function clicked(evt) { 
    alert(document.getElementById('foo').checked); 
    evt.preventDefault(); 
} 

document.getElementById('foo').addEventListener('click',clicked); 

[क्रोम और फ़ायरफ़ॉक्स में परीक्षण]

JSFiddle for that code

चेतावनी "सही" (या चेकबॉक्स पूर्व क्लिक के विपरीत राज्य) जवाब देंगे। अलर्ट को खारिज करने के बाद, चेकबॉक्स वापस टॉगल करता है।

तो, मुझे लगता है कि सवाल कर रहे हैं,

वास्तविक डिफ़ॉल्ट घटना क्या रोका जा रहा है? क्या मैं यह मानने में गलत हूं कि राज्य के बदलाव से पहले मेरा इवेंट हैंडलर चलाना चाहिए? क्या चेकबॉक्स क्लिक को वैध रूप से अवरुद्ध करने का कोई तरीका है?

और दुनिया में क्यों रोकथाम है क्योंकि चेकबॉक्स को फिर से टॉगल कर रहा है?

+0

अजीब चीज यह भी है कि यदि आप 'क्लिक किए गए' के ​​अंदर दो लाइनों को स्वैप करते हैं, तो आपको वही परिणाम मिलता है। तो यह * चेतावनी के बाद * तक नहीं है कि यह वास्तव में डिफ़ॉल्ट को रोकता है। http://jsfiddle.net/pimvdb/NHwXs/3/ – pimvdb

+0

@pimvdb - ऐसा इसलिए है क्योंकि 'evt.prevntDefault() 'ध्वज को टॉगल करता है और किसी ईवेंट हैंडलर के भीतर से कहीं भी कहा जा सकता है। इसे कॉल के अंत में दिखाई नहीं देना है। यह नियंत्रित करता है कि डिफ़ॉल्ट हैंडलर * नए बाउंड एक खत्म होने के बाद * होता है या नहीं। –

+0

इसके बजाय आप 'mousedown' को रद्द करके चेकिंग को रोक सकते हैं। – Hemlock

उत्तर

8

वास्तविक डिफ़ॉल्ट घटना कोclick ईवेंट से रोका जा रहा है। गलतफहमी शायद इसलिए होती है क्योंकि वास्तविक घटना को पूरी तरह से संसाधित करने के बाद आप घटना के बारे में सोच रहे हैं (यानी चेकबॉक्स को टॉगल किया गया है) जबकि वास्तविकता में घटना मॉडल निर्धारित करता है कि हैंडलर पर आग लगाता है जबकि घटना संसाधित की जा रही है।

यदि यह मदद करता है, तो यह पता लगाने में उपयोगी पाया गया है कि यह कैसे काम करता है यह डेटाबेस लेनदेन मॉडल है: लेन-देन के हिस्से के रूप में आपके ईवेंट हैंडलर के बारे में सोचें, जिसके अंदर चेकबॉक्स पहले से ही टॉगल किया गया है।

  • यदि आप चेकबॉक्स की स्थिति पढ़ते हैं, तो आपको यह टॉगल किया जाएगा ("लिखना" डेटाबेस में भेजा गया है)।
  • हालांकि, आप अभी भी लेनदेन को रोलबैक करने का निर्णय ले सकते हैं (जिस स्थिति में लेखन पूर्ववत हो गया है और चेकबॉक्स को मूल मूल्य पर वापस टॉगल किया गया है)।
+0

धन्यवाद, यह एक सुंदर मूल अवधारणा है कि मुझे आश्चर्य है कि मैं सक्षम था इतने लंबे समय तक स्कर्ट करने के लिए। – jsoverson

+0

एक कार्यान्वयन की कल्पना करना आसान है जो मनाए गए व्यवहार को प्रस्तुत करता है। हालांकि, मैं पेशकश करता हूं कि यह प्रतिद्वंद्वी है। अपने उदाहरण के साथ चिपके हुए, कल्पना करें कि क्या मैं एक लेनदेन शुरू करना चाहता हूं, 'INSERT' करें, फिर 'SELECT' करें जो' INSERT' को सत्यापित करता है, फिर सत्यापन विफल होने पर लेनदेन को वापस रोल करें। यह अपमानजनक है। कोई भी पहले 'चयन' कर सकता है, सत्यापन कर सकता है, फिर 'INSERT' निष्पादित कर सकता है। ऐसी स्थितियां हैं जहां यह संभव नहीं है, लेनदेन की आवश्यकता है। मुझे विश्वास नहीं है कि यह उन स्थितियों में से एक है। – crush

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