2009-03-10 12 views
26

के साथ jQuery यूआई संवाद समस्या यूआई संवाद के साथ मैं नई jQuery 1.3.2 और jQuery-UI-1.7 पुस्तकालयों का उपयोग कर रहा हूं। मेरे पास कई रूप तत्वों (टेक्स्टबॉक्स, चेकबॉक्स, आदि) के साथ एक div टैग है। पृष्ठ लोड पर, jQuery div को एक संवाद के रूप में दिखाता है। यह एफएफ में बिल्कुल ठीक काम करता है, लेकिन आईई में, div की ऊंचाई गलत है। यह केवल शीर्षक बार को शीर्षक बार दिखा रहा है। Div बनाते समय मैं स्पष्ट रूप से ऊंचाई निर्धारित करता हूं। यदि मैं संवाद खोलने के बाद ऊंचाई विकल्प सेट करता हूं, तो ऊंचाई को सही किया जाता है, लेकिन सामग्री खाली होती है (टेक्स्टबॉक्स का शीर्ष तीसरा दिखाता है)। यदि मैं संवाद को आकार देने की अनुमति देता हूं, यदि आप इसे IE में आकार बदलते हैं तो यह ठीक काम करता है, लेकिन मैं आईई उपयोगकर्ताओं को सामग्री को देखने के लिए आकार बदलने के लिए मजबूर नहीं करना चाहता हूं। कोई विचार? यहां कोड है जिसका उपयोग मैं संवाद बनाने के लिए करता हूं:आईई

$('#dialogDiv').dialog({ 
    bgiframe: true, 
    height: 400, 
    width: 620, 
    modal: true, 
    draggable: true, 
    resizable: false, 
    close: function(event, ui) { 
     if($('#agree').val() != '1') 
      location.href = 'somepage.html'; 
    } 
}); 

उत्तर

0

मैंने अपने स्वयं के प्रश्न का उत्तर दिया है। मुझे सिर्फ संवाद की ऊंचाई गुणों और संवाद के कुछ तत्वों के साथ खेलना पड़ा। अच्छा मुझे बुलाओ!

+3

में ठीक काम करता है यह सवाल का जवाब नहीं देता है। – CodingWithoutComments

+0

मुझे div टैग में कुछ टेक्स्टबॉक्स का आकार बदलना था जो मेरे संवाद के रूप में कार्य कर रहा था और मेरे jquery कोड में ऊंचाई विशेषता को हटा दिया था। यदि अन्य व्यक्ति अपने स्वयं के उत्तर के आधार पर अपनी समस्याओं को हल करने में सक्षम थे, तो मुझे लगता है कि यह सवाल का जवाब देता है। –

+3

मैं पुष्टि कर सकता हूं कि संवाद ({...}) में पारित वस्तु में ऊंचाई संपत्ति निर्दिष्ट नहीं करता है, यह आईई में काम करता है। मुझे नहीं पता कि क्यों। –

4

मैं भी एक ही समस्या में आया था। हां, ऊंचाई निर्दिष्ट नहीं करके, आईई संवाद बॉक्स का आकार बदलता है और इसकी सामग्री दिखाता है। हालांकि, मैं नहीं चाहता कि मोडल डायलॉग बॉक्स बढ़ते रहें क्योंकि सामग्री अधिक हो जाती है। आदर्श निर्दिष्ट ऊंचाई के साथ संवाद बॉक्स प्रदर्शित करना होगा और उपयोगकर्ता स्क्रॉल बार का उपयोग करके सामग्री देख सकते हैं। यह फ़ायरफ़ॉक्स में पूरी तरह से काम करता है। क्या किसी के पास आईई के लिए समाधान है?

30

कुछ Google खोज करने के बाद, मुझे प्रश्न का सही जवाब मिला। यह एक असंगत Doctype के कारण होता है। अधिक जानकारी के लिए कृपया http://osdir.com/ml/jquery-ui/2009-08/msg00388.html पर जाएं।

मैंने इसे अपने कोड पर आज़माया और इस यूआरएल में समाधान समस्या को हल करता है।

+6

यह समस्या का सही जवाब है। मेरे पास एक ही समस्या है और DOCTYPE सहित वास्तव में jQuery के साथ कुछ स्टाइल मुद्दों को हल करता है। –

+1

समाधान साझा करने के लिए धन्यवाद, यह आईई 9 के साथ भी काम करता है। – will824

+2

बहुत बहुत धन्यवाद। यह वास्तव में समस्या हल करता है। आईई बेकार है –

0

मैं इस तरह ऊंचाई पर एक इकाई देकर इसे ठीक करने में सक्षम था:

$(id).dialog({ modal: true, height: h + "px", width: w }); 

मैं doctype साथ गड़बड़ करने के लिए नहीं था। यह आईई 8, jQuery 1.4.4, और jQuery यूआई 1.8.9 पर था।

- इसे पोस्ट करने के लिए जल्दी से। यह फ़ायरफ़ॉक्स में इसे तोड़ देता है। मुझपर ध्यान मत दो!

19

मैं आईई 7 में एक ही समस्या का सामना कर रहा था और लक्षणों और समाधान में गहरी नजर डाली। मैंने देखा कि जब मैंने कोई सामग्री के साथ एक डमी संवाद बनाया तो ऊंचाई सही ढंग से प्रस्तुत की गई। इस प्रकार, मैंने विभिन्न प्रकार की सामग्री के साथ खेलना शुरू किया ताकि यह देखने के लिए कि क्या मैं इस मुद्दे को दूर करने के लिए सामग्री को अलग-अलग लिख सकता हूं। कोई भाग्य नहीं। हालांकि, मैंने जो खोजा था, वह यह था कि जितनी अधिक सामग्री मैंने जोड़ा, उतना छोटा संवाद केवल आईई 7 में मिला (यहां तक ​​कि छुपे हुए आइटम भी इसे छोटा करते हैं)। इस प्रकार, साधारण सामग्री की संभावना अधिक ध्यान देने योग्य प्रभाव नहीं होगी (और, इस प्रकार, इस मुद्दे पर अधिक शिकायतों की कमी)। तालिका और कई रूपों को मैं जोड़ रहा था जो एक बहुत ही ध्यान देने योग्य प्रभाव बनाते हैं।

ऊंचाई को ऑटो कामों में कुछ हद तक अच्छी तरह से सेट करना, लेकिन आईई 7 अभी भी मेरी सामग्री पर ऊंचाई को लगभग 10 पिक्सेल बहुत कम (संभवतः किसी ऑब्जेक्ट पर पैडिंग ऊंचाई) का अनुमान लगाता है और इस प्रकार jQuery स्क्रॉलबार जोड़ता है। सही नहीं है, लेकिन स्वीकार्य है जो निम्नलिखित है।

एक और कामकाज खोजने में विफल होने के बाद, मैंने DOCTYPE समाधान को देखना शुरू कर दिया। मैंने पाया कि हमारी साइट का डॉक्टरेट - हालांकि यह सही दिखता है - यह वास्तव में सभी ब्राउज़रों को "क्विर्क मोड" में डालता है और यह कि इस मुद्दे का सही स्रोत है। मुझे संदेह है कि jQuery क्विर्क मोड मुद्दों का समर्थन करता है इसलिए मुझे संदेह है कि यह कभी भी तय किया जाएगा।

मेरे वर्तमान DOCTYPE:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

यह क्या किया जाना चाहिए:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

यहां तक ​​कि इस बड़े DOCTYPE काम किया:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/transitional.dtd">

इस प्रकार, यह नहीं है कि DOCTYPE <!DOCTYPE html> का HTML 5 मान होना चाहिए, यह है कि यह एक वैध DOCTYPE (HTML 4 या 5 - एक्सएचटीएमएल के बारे में निश्चित नहीं है) होना चाहिए जो आईई 7 को क्विर्क मोड के अलावा किसी अन्य चीज़ पर सेट करेगा (फ़ायरफ़ॉक्स ठीक से काम करता है)। देखें:

http://en.wikipedia.org/wiki/Quirks_mode#Comparison_of_document_types

मैं हमारी साइट की DOCTYPE को बदलने के लिए विकल्प नहीं है इसलिए मैं इस तरह के ऑटो ऊंचाई के रूप में एक और समाधान का उपयोग करने के लिए है। मैंने देखा कि jQuery संवाद का उपयोग करते समय क्विर्क और मानक मोड के बीच अन्य अंतर हैं इसलिए मुझे उन लोगों से भी निपटना होगा (अर्थात्, फ़ॉन्ट आकार प्रतिशत आईई 7 और फ़ायरफ़ॉक्स दोनों में अलग-अलग जमा होते हैं)।

0

मुझे पिक्सेल में फ़ॉन्ट-आकार का उपयोग करते समय भी इसी तरह की समस्याएं मिलीं। फ़ॉन्ट-आकार: 11 पीएक्स - फ़ॉन्ट-आकार: 15 पीएक्स; सीएसएस में यानी 9 में ऊंचाई की समस्याएं हुईं। फ़ॉन्ट आकार: 16 पीएक्स; और ऊपर 9