tl; dr: मैं एक डोम तत्व कैसे प्राप्त करूं, जो एक क्लिक हैंडलर द्वारा दिखाई देता है, अंतिम होने के लिए body
के करीब से पहले तत्व गतिशील रूप से जेनरेट किए गए तत्वों को जोड़ा जा रहा है?jQuery - गतिशील रूप से जेनरेट किए गए तत्वों के बाद भी डीओएम (शरीर के नजदीक से पहले) में एक तत्व बनाते हैं
अनिवार्य रूप से मैं उस क्लिक को खोलना चाहता हूं जो तत्व खोलता है, इसे डीओएम में भी ले जाया जाता है ताकि कुछ गतिशील तत्वों को जोड़ने के बाद भी शरीर बंद हो जाए।
मेरा मुद्दा एक मॉडल से उत्पन्न होता है जो एक पृष्ठ पर कई मोडल होने पर एक और मोडल में खोला जा रहा है। एक पकड़ यह है कि डिपोम में पृष्ठ लोड पर डिपोल्स मौजूद हैं जबकि प्राथमिक मोड को तत्काल चालू किया जा रहा है (उपनिवेश उत्पन्न करने के लिए अलग-अलग कोड का उपयोग करते हैं जबकि प्राथमिक लोग jQuery UI संवाद का उपयोग करते हैं)।
यदि आप एक मोडल खोलते हैं और फिर सबमिडल खोलें तो सब ठीक है। यदि आप दूसरा मोडल खोलते हैं तो इसे बंद करें जब आप उस पहले मोडल को फिर से खोलें तो submodal दिखाई नहीं देगा क्योंकि यह दूसरे मोडल के नीचे छिपा हुआ है। अगर मैं इन सबोडोडल्स को शरीर में जोड़ता हूं, इस प्रकार उन्हें किसी भी जेनरेट किए गए मोडल के बाद डाल दिया जाता है तो वे ठीक दिखाई देते हैं (लेकिन इससे अन्य समस्याएं उत्पन्न होती हैं)। ऐसा लगता है कि यह एक जेड-इंडेक्स समस्या प्रतीत नहीं होता है (मैंने किसी भी भाग्य से संबंधित सब कुछ करने की कोशिश नहीं की है), ऐसा लगता है कि इन मॉडलों को डीओएम में कहाँ रखा गया है।
कोड साफ हो सकता है:
यह एचटीएमएल पृष्ठ लोड पर कैसा दिखता है:
<div id='submodal_1' class='submodal'>foo</div>
<div id='submodal_2' class='submodal'>bar</div>
</body>
आप पहली बार प्राथमिक मोडल विंडो खोलने के लिए क्लिक करने के बाद:
<div id='submodal_1'>subfoo</div>
<div id='submodal_2'>subbar</div>
<div id='primary_modal_1' class='ui-dialog' style='display:block'>foo</div>
</body>
के बाद आप उस मोडल के सबमिडल को खोलने के लिए क्लिक करते हैं, मुझे प्रोडोडल को प्राथमिक मोडल से नीचे ले जाना है अन्यथा यह दिखाई नहीं देगा (और फिर, जेड-इंडेक्स इस अवरोध को प्रभावित नहीं करता है):
$('#submodal_1').insertAfter('#primary_modal_1');
इस बिंदु पर यदि आप #primary_modal_1
को बंद करते हैं तो यह छिपा होगा लेकिन फिर भी डोम में होगा। इस बिंदु पर
<div id='submodal_2' class='submodal'>subbar</div>
<div id='primary_modal_1' class='ui-dialog' style='display:none'>foo</div>
<div id='submodal_1' class='submodal'>subfoo</div>
<div id='primary_modal_2' class='ui-dialog' style='display:block'>bar</div>
</body>
अगर आप पहले प्राथमिक मोडल फिर से खोलना और उसके submodal submodal दिखाई नहीं देगा खोलने का प्रयास करें: यदि आप दूसरी खोलते हैं कोड अब की तरह दिखाई देगा। लेकिन यदि आप submodal के लिए कदम है कि पिछले प्राथमिक मोडल नीचे है, इसलिए जैसे:
<div id='submodal_2' class='submodal'>subbar</div>
<div id='primary_modal_1' class='ui-dialog' style='display:block'>foo</div>
<div id='primary_modal_2' class='ui-dialog' style='display:none'>bar</div>
<div id='submodal_1' class='submodal'>subfoo</div> //<-- moved this line
</body>
submodal सही ढंग से दिखाई देगी। मैं यह सुनिश्चित करना चाहता हूं कि डिपोमल्स हमेशा डीओएम में रहें, भले ही कितने प्राथमिक मॉडल जोड़े गए हों।
यह उन तत्वों के लिए ठीक काम करता है जो पहले ही डोम में हैं लेकिन गतिशील रूप से जोड़े गए नहीं हैं। जब वे बनाए जाते हैं तो गतिशील रूप से जोड़े गए मोड डोम में अंतिम होंगे। – Stuart
मैं एक JSFiddle पर काम कर रहा हूं ... – FMaz008
हो गया, आप एक पीओसी के लिए JSfiddle की जांच कर सकते हैं :) – FMaz008