एक div एक रूप एक तालिका युक्त युक्त साथ एक HTML खंड IE8

तहत jQuery से नेस्टेड प्रपत्र को छिपाने के लिए कैसे:एक div एक रूप एक तालिका युक्त युक्त साथ एक HTML खंड IE8

<!DOCTYPE html> 
<html> <!-- xmlns="http://www.w3.org/1999/xhtml" lang="en" --> 
<head> 
    <style type="text/css"> 
    #content{position:relative} 
    table {border-color:#999;border-style:solid} 
    </style> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
</head> 

<body> 
    <button onclick="javascript:$('.content-panel').toggle();">Toggle</button> 
    <div id="content"> 
     <div class="content-panel"> 
      <form action='' method='post'> 
       <select> 
        <option>a </option> 
       </select> 

       <table> 
        <tr><td>ABCDEF</td></tr> 
       </table> 
      </form> 
     </div> 
    </div> 
</body> 
</html>

टॉगल बटन प्रपत्र और उसके नेस्टेड तालिका छुपाना चाहिए, लेकिन इतना नीचे नहीं करता है IE8। (संस्करण 8.0.60001) फॉर्म सामग्री छिपी हुई है, लेकिन तालिका सीमा दिखाना जारी है, और इसके आकार को बरकरार रखती है। यह मानक मोड से संबंधित है; यह quirks-मोड में गायब हो जाता है।

क्या किसी के पास इसके लिए कोई कामकाज है?

यह उदाहरण पृष्ठ कम हो गया है, जहां तक मैं इसे कम कर सकता हूं। अगर मैं divs का चयन या तो हटा देता हूं, तो समस्या गायब हो जाती है। चयन मौजूद होना चाहिए, और तालिका को रूप में घोंसला होना चाहिए, क्योंकि इसमें फॉर्म तत्व होंगे। http://dev.rdbhost.com/rdbadmin/mainProbDemo.html

मैं एक बेहद सरल उदाहरण है, जो प्रतिलिपि प्रस्तुत करने योग्य नहीं था के साथ इस समस्या पहले पोस्ट की गई:

पेज में ही है। अगर आपने इसे देखा तो धन्यवाद।

स्रोत

2010-04-29 Rdbhost

आपको लगता है कि jsfiddle लिंक साझा कर सकते हैं? – rahul

अनजाने में, आपकी त्रुटि [पुन: उत्पन्न नहीं है] (http://jsbin.com/ifaxe4)। आपको वास्तव में पृष्ठ से लिंक करना चाहिए। – Kobi

असल में, यदि आप "संपादित करें" पर क्लिक करते हैं तो फिर से पूर्वावलोकन करें, फिर पुन: उत्पन्न करें ... फिर यह केवल जेएसबीएन के साथ एक समस्या है। मैं अपने डेस्कटॉप पर एक HTML फ़ाइल से समस्या को पुन: उत्पन्न नहीं कर सका। किसी भी तरह से, सीएसएस का उपयोग करके div को क्यों न छुपाएं? – Mottie

आपके ऑनक्लिक हैंडलर में जावास्क्रिप्ट क्यों है: इसमें स्कीमा घोषणा?

<button onclick="$('.content-panel').toggle();">Toggle</button>

स्रोत

2010-06-10 19:46:44 landons

कुछ बदलता है, ठीक है, ब्राउजर में उन सभी * अन्य * भाषा रन-टाइम से भाषा को असंबद्ध करने के लिए। कभी-कभी मेरा कोड पागल है। कभी-कभी यह पर्याप्त पागल नहीं है। – Rdbhost

मेरी गलती ... किसी ने कभी भी वीबीस्क्रिप्ट का उपयोग नहीं किया है या कुछ समय के लिए पसंद किया है। क्या आपने div पर कक्षा को टॉगल करने का प्रयास किया है? इस तरह आप अपने सीएसएस में टेबल और किसी अन्य बच्चे तत्वों को कैस्केड करने के लिए कुछ नियम निर्धारित कर सकते हैं ... – landons

http://api.jquery.com/detach/ आप के लिए काम कर सकते हैं, तो केवल छुपा काम नहीं करता है - यह डोम से तत्व निकाल देंगे, लेकिन यह बचाने के लिए इतना है कि आप इसे फिर से लगाएं सकते हैं यदि आप करने के लिए (http://api.jquery.com/append/ या http://api.jquery.com/appendTo/ उपयोग करते हुए) चाहते हैं। आप दृश्यता सीएसएस विशेषता $(".content-panel").css("visibility","hidden"); को अतिरिक्त उपाय के रूप में सेट करने का भी प्रयास कर सकते हैं (ध्यान दें कि इसका अर्थ यह होगा कि तत्व अभी भी स्थान लेता है, http://www.w3schools.com/css/pr_class_visibility.asp भी देखें) (संपादित करें: $(".content-panel").css("visibility","visible"); के साथ वापस लाएं)। अंतिम लेकिन कम से कम नहीं, आप कभी नहीं जानते - शायद show(0); और hide(0); कार्यों का उपयोग कर और टॉगल किसी भी तरह से बोर्क किया गया है - संभव नहीं, फिर मुझे लगता है कि इस मामले में मर्फी लागू होता है।

स्रोत

2010-06-12 11:03:41 ralokt

क्या आपके साथ अतिरिक्त फॉर्म तत्वों को अतिरिक्त तालिका के साथ लपेटना ठीक है? कुछ इस तरह:

<!DOCTYPE html> 
<html> <!-- xmlns="http://www.w3.org/1999/xhtml" lang="en" --> 
<head> 
    <style type="text/css"> 
    #content{position:relative} 
    .inner {border-color:#999;border-style:solid} 
    </style> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
</head> 

<body> 
    <button type="button" onclick="javascript:$('.content-panel').toggle();">Toggle</button> 
    <div id="content"> 
     <div class="content-panel"> 
      <form action='' method='post'> 
       <table> 
        <tr> 
         <td> 
          <select> 
           <option>a </option> 
          </select> 
         </td> 
        </tr> 
        <tr> 
         <td> 
          <table class="inner"> 
           <tr><td>ABCDEF</td></tr> 
          </table> 
         </td> 
        </tr> 
       </table> 
      </form> 
     </div> 
    </div> 
</body> 
</html>

या सिर्फ तालिका आपके पास करने के लिए प्रपत्र के तहत सभी तत्वों को जोड़ने:

<form action='' method='post'> 
      <table> 
       <tr> 
        <td> 
         <select> 
          <option>a </option> 
         </select> 
        </td> 
       </tr> 
       <tr> 
        <td> 
         ABCDEF 
        </td> 
       </tr> 
      </table> 
    </form>

स्रोत

2010-06-17 14:58:38 ifaour

एक div एक रूप एक तालिका युक्त युक्त साथ एक HTML खंड IE8

उत्तर

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