DOM

2010-01-19 11 views
10

से JQuery संवाद को कैसे निकालें I ऐसी स्थिति में चला गया है जहां मुझे नए बनाने से पहले पुराने संवाद मैन्युअल रूप से निकालना होगा। एक और धागा में, निम्न विधि सुझाव दिया गया था:DOM

$('.ui-dialog').empty().remove(); 

और मुझे लगता है यह काम करेगा, लेकिन मैं अन्य संवादों कि मैं डोम से दूर करने के लिए नहीं करना चाहती है, और मुझे लगता है कि इस विधि से छुटकारा पाने के हैं उन सभी को। फायरबग के साथ पृष्ठ का निरीक्षण करने से पता चलता है कि एक बार JQuery आपके द्वारा प्रदान किए गए एचटीएमएल से एक संवाद बनाता है, यह मानक क्लास divs देता है, सभी एक ही कक्षा के साथ। ये हैं:

ui-dialog ui-widget ui-widget-content ui-corner-all ui-draggable 

तो वे बहुत सामान्य हैं, और यह बाहरी रैपर कक्षाएं जाने की जरूरत है कि के बारे में एक अनूठा विशेषता को खोजने के लिए मुश्किल है। मैं उन संवादों को हटाने का एक तरीका ढूंढने की कोशिश कर रहा हूं जिन्हें मैं निकालना चाहता हूं, और दूसरों को छोड़ दें। कोई विचार?

उत्तर

3

आत्म-उत्तर:

संवाद बनाते समय, आमतौर पर आप इसे एक के आधार पर बना रहे हैं:

तो अपने मूल प्रश्न के फिलिप के उत्तर के आधार पर मैं निम्नलिखित दृष्टिकोण है, जो काम किया ले लिया आईडी, और एक बार JQuery संवाद बनाता है, वह HTML (आईडी के साथ) अभी भी रैपर के नीचे है। यकीन है कि मैं सही संवाद को हटाने गया था बनाने के लिए, मैं प्रयोग किया जाता JQuery के has, इस तरह:

$('.ui-dialog:has(#' + $myDialogDiv.attr('id') + ')').empty().remove(); 

यह पहला आवरण की सामग्री को खाली है, तो डोम से निकालता है।

विचारों के लिए फिलिप के लिए धन्यवाद।

0

डीओएम तैयार करने पर एक सरणी बनाएं और वांछित संवादों के संदर्भ जोड़ें जैसे आप उन्हें प्रदर्शित करते हैं। फिर, जब आप उन्हें हटाना चाहते हैं, तो सरणी को jQuery पर पास करें और remove()

0

क्यों नहीं बंद किए गए संवादों में कस्टम क्लास क्यों नहीं जोड़ते हैं। तो जब आप कोई डॉयलॉग बंद करें, फोन:

thisDialog.addClass("olddialog"); 

तो फिर तुम बस का उपयोग कर उन सब को निकाल सकते हैं:

$(".olddialog").remove(); 
+0

मुझे यकीन है कि मैं क्या एक कस्टम वर्ग के लिए जोड़ना होगा नहीं हूँ। याद रखें मुझे बाहरी रैपर को हटाने की जरूरत है JQuery इसे देता है (मैंने जो भी HTML लिखा है), और नीचे सबकुछ नहीं। इसलिए यदि आप सुझाव दे रहे हैं कि मैं div में एक वर्ग जोड़ता हूं जिसका मूल रूप से संवाद बनाने के लिए उपयोग किया जाता है, जो बस एक जोड़ देगा रैपर के नीचे एचटीएमएल के लिए कक्षा। फिर जब मैं इसे हटाने की कोशिश करता हूं, तो यह केवल रैपर के नीचे जो होता है उसे हटा देगा। मुझे केवल बाहरी रैपर चुनने का एक तरीका चाहिए। इसका मतलब है कि उन्हें चुनना और कक्षा जोड़ना या बस चुनना उन्हें और उन्हें हटाकर, समस्या अभी भी वही है। धन्यवाद हालांकि – BAHDev

+1

फिर आप इसका उपयोग कर सकते हैं(): $ ("। ui-dialog: है (.olddialog)")। ove(); –

3

उचित तरीके $('#yourdialog').dialog('destroy').remove(); है अपने संवाद मानते हुए एक उचित आईडी है।

+0

@CalebD, इस प्रतिक्रिया के लिए धन्यवाद, और मैंने कोशिश की है। लेकिन किसी भी कारण से, यह jQuery को बना रहे संवादों को हटा नहीं रहा है। मुझे लगता है कि JQuery ने असाइन किए गए बाहरी रैपरों के बजाय मूल चयनकर्ता पर निकालने() को करने का प्रयास करने के साथ ऐसा कुछ करने के लिए किया था। – BAHDev

+0

.dialog ('नष्ट') कॉल सभी रैपर को हटा देना चाहिए और तत्व को प्रारंभिक स्थिति में पुनर्स्थापित करना चाहिए और फिर .remove() इसे DOM से बाहर निकाल देता है। आप संवाद कैसे बना रहे हैं? – CalebD

+0

+1 बिल्कुल सही, अभी भी 2014 में रिलीज! –

0

संपादित:

अन्य टिप्पणी आपके द्वारा किए गए Ive gleaned तुम सिर्फ इसे वापस पूर्व init राज्य यानी करने के लिए सामग्री लेकिन does not dialog.destroy सुरक्षित रखना चाहते हैं से। कम गतिशील बाहरी मार्कअप?

आप उन्हें एक अद्वितीय 'संवाद क्लास' दे सकते हैं जब आप उन्हें बनाते हैं और उन्हें इस तरह संदर्भित करते हैं या आप एक कॉलबैक प्रदान कर सकते हैं जो आईडी को विज्ञापन करता है - या तत्व को संवाद करने से पहले आईडी जोड़ें।

हालांकि, व्यक्तिगत रूप से मैं केवल प्रति पृष्ठ/दृश्य में एक संवाद का उपयोग करता हूं और आवश्यकतानुसार सामग्री को रीसेट करता हूं।

13

मुझे पता है कि यह विषय पुराना है, लेकिन मैं हाल ही में एक ही स्थिति में भाग गया। मेरे मामले के लिए, मैं गतिशील रूप से संवाद बनाते हैं और .load() का उपयोग करते हैं। jQuery वास्तव में डोम के साथ निराला सामान करता है और मुझे महत्वपूर्ण परेशानी पैदा कर रहा था।बंद होने के बाद डोम में अनावश्यक "बकवास" छोड़ा गया था, और कभी-कभी, संवाद को हटा दिया गया था। मैं "div" को नहीं हटा सका क्योंकि यह अंदर था क्योंकि मैं वास्तव में कुछ राज्य की जानकारी को बनाए रखने के लिए div की सामग्री का उपयोग करता हूं। मैं निम्नलिखित कोड के साथ आया और इसे सत्यापित करने के लिए इसे सीमित फैशन में परीक्षण किया। ऐसा लगता है कि jQuery सभी अनावश्यक सामान को हटा रहा है जो jQuery पीछे जा रहा था। मैंने यह भी सुनिश्चित करने के लिए कि प्रत्येक संवाद के राज्य को सही ढंग से बनाए रखा गया था, प्रक्रिया के दौरान मैंने कई खिड़कियां खोलने और डीओएम की स्थिति की निगरानी की। मैं लोड संवाद के अपवाद के जो इसमें कुछ कोड के साथ एक div से ज्यादा कुछ नहीं था के साथ यहाँ पूरे कोड पोस्ट करेंगे (।

<html> 
     <head> 
      <link href="css/redmond/jquery-ui-1.8.1.custom.css" type="text/css" rel="stylesheet" media="screen" /> 
      <script src="js/jquery-1.4.2.min.js" type="text/javascript"></script> 
      <script src="js/jquery-ui-1.8.1.custom.min.js" type="text/javascript"></script> 

      <script type="text/javascript"> 
       $(document).ready (function() { 
        $("#openDialog").click (function() { 
         $("<div></div>") 
          .load ("loadDialogTest.php") 
          .appendTo ($("#containingDiv")) 
          .dialog ({ 
          autoOpen: 'false', 
          title: 'Test This!', 
          close: function() { 
           $(this).dialog ('destroy').remove(); 
          } 
         }).dialog ('open'); 
        }); 
       }); 
      </script> 
     </head> 

     <body> 
      <a href="#" id="openDialog">Open it</a> 

      <div id="containingDiv"> 
      </div> 
     </body> 

    </html>