5

मुझे एक बहुत बड़ा जटिल एचटीएमएल 5 ऐप मिला है जो मैं काम कर रहा हूं (रीढ़ की हड्डी, मैरिएनेट, jquery, अंडरस्कोर, हैंडलबार्स, बूटस्ट्रैप, आदि) और ऐप के भीतर गहरी एक मोडल पॉपअप है इसमें एक रूप के साथ।मैं रहस्यमय रूप से बाध्य जावास्क्रिप्ट घटनाओं को कैसे ढूंढूं

जब मोडल खुलता है, पहली बार जब आप किसी भी फॉर्म फ़ील्ड पर क्लिक करते हैं तो फॉर्म फ़ील्ड स्वयं को चुनता है। उसके बाद पहले क्लिक करें आप फ़ॉर्म को सामान्य के रूप में उपयोग कर सकते हैं। जब ऐप को अंततः उत्पादन में आईफ्रेम में लोड किया जाता है (पूछें नहीं) पहली बार जब आप किसी भी फॉर्म फ़ील्ड पर क्लिक करते हैं या किसी भी बटन पर होवर करते हैं, तो पूरे पृष्ठ को div तत्व के शीर्ष तक नीचे स्क्रॉल किया जाता है, यह फ़ॉर्म अंदर के अंदर है मोडल पृष्ठ के शीर्ष पर है, लेकिन यह एक बार ऐसा करने के बाद, यह फिर से नहीं करता है (अभी तक उलझन में है? हाँ, यह जटिल और स्तरित है)।

मुझे इस समस्या को डिबग करने के लिए भी नुकसान हुआ है (कोड की हजारों लाइनें, पुस्तकालयों के दो मुट्ठी भर)।

मैं इन की कोशिश की:

console.log('bound events: ', $._data(this.$el.find('#RandomFieldID')[0], 'events')); 
console.dir($('#elmId').data('events')); 
console.log('bound events: ', $._data($('body')[0], 'events')); 

लेकिन वह कुछ भी नहीं मिले।

चूंकि यह ढांचे पर ढांचे पर लाइब्रेरी पर लाइब्रेरी है, इसलिए मुझे यह भी सुनिश्चित नहीं है कि इस क्षेत्र को स्पष्ट रूप से बाध्य करने वाली चीज़ को ढूंढने का प्रयास करना शुरू हो गया है, या यहां तक ​​कि यदि यह क्षेत्र है जो बाध्य हैं या कुछ और पूरी तरह से ...

तो, एक रहस्यमय रूप से बाध्य जावास्क्रिप्ट ईवेंट (एकाधिक जेएस पुस्तकालयों और ढांचे के साथ, जो समस्या हल हो जाती है, तब तक केवल तब तक टिप्पणी नहीं की जा सकती है जब वे निर्भर हैं एचटीएमएल को पहले स्थान पर पेज पर भी दिखने के लिए)?

और, दुर्भाग्य से मैं एक jsfiddle या कुछ नहीं कर सकता क्योंकि, जैसा कि मैंने कहा था, यह ऐप के भीतर गहरा गहरा है और मुझे मूल रूप से जेएसफ़िल्ड (असंभव) के अंदर ऐप को फिर से बनाना होगा एक उदाहरण (और, यह एक बाहरी सामना करने वाली साइट में नहीं है, इसलिए, मैं इसे केवल उत्पादन में रहने के लिए लिंक नहीं कर सकता)।

मैं स्टंप हो गया हूं। किसी भी मदद के लिए धन्यवाद!

+0

यह विशेष रूप से सुरुचिपूर्ण नहीं है, लेकिन इस विशिष्ट समस्या को हल करने के लिए एक त्वरित हैक के रूप में आप पॉपअप के लिए विशिष्ट/अद्वितीय कुछ भी कर सकते हैं? – kwah

+1

प्रासंगिक: स्क्रीनशॉट संदर्भों के लिए http://stackoverflow.com/questions/1558569/firefox-extension-to-find-out-which-javascript-event-is-bound-to-an-inspected-el – kwah

उत्तर

10

यहां मैं क्रोम के साथ ऐसा कैसे करता हूं।

  1. Ctrl-Shift-J Javascript कंसोल खोलें करने के लिए।

  2. नीचे बाईं ओर छोटे आवर्धक ग्लास पर क्लिक करें, यह आपको अपने माउस के साथ एक तत्व चुनने देता है।

    Click magnifying glass

  3. अपने पृष्ठ पर एक तत्व पर क्लिक करें (के रूप में आप इसे करने के लिए जाना यह उजागर होगा।) यह तल पर डोम में प्रकाश डाला और नीचे सही पर गुण का एक समूह दिखाई देगा।

  4. तल में सही अतीत सीएसएस गुण और सामान सभी रास्ते जाने के घटना श्रोताओं के लिए नीचे:

    ???

  5. घटना श्रोता में आपकी रुचि है उठाओ यह आप बाध्य दिखाएगा। फ़ंक्शन के साथ-साथ कोड की सटीक पंक्ति में कौन सी स्क्रिप्ट निष्पादित की जाएगी। आपको यह बताना चाहिए कि पुस्तकालय आपकी पागल चीजें क्या कर रहा है।

    Profit!

मैं क्रोम डिबगर अधिक शक्तिशाली और तेजी से (अंतराल नहीं है) Firebug तथा आईई डेवलपर उपकरण की तुलना में पाते हैं। यह अत्यधिक अनुशंसित है :)

+0

+1 – AlienWebguy

+0

उपयोगी; लेकिन [यह जानकर कि jquery सुन रहा है] (http://ad7six.com/dump/events.png) अधिकतर समय में मदद नहीं करता है। – AD7six

+0

यह बहुत अच्छा है! मैं हमेशा सीएसएस का विस्तार करता हूं और कभी नहीं देखा कि इसके नीचे सामान था! धन्यवाद! मैंने कोशिश की और हर बाध्य घटना में ब्रेकपॉइंट्स सेट किए और इस घटना को कभी नहीं मिला जो इस अवांछित व्यवहार का कारण बन रहा था। अंततः मैंने मॉडल को बाहर निकाला और स्थानांतरित कर दिया और समस्या समाप्त हो गई, इसलिए, मैं आगे बढ़ रहा हूं ... – cmcculloh

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