2011-02-09 17 views
5

सुनिश्चित करें कि इस के लिए एक स्पष्ट उत्तर है लेकिन मुझे यह नहीं पता है। मैं JQuery .load() का उपयोग कर गतिशील रूप से एक पृष्ठ लोड कर रहा हूं "लोड" पृष्ठ पर फॉर्म तत्वों के साथ एक फॉर्म है उदा। input type="number" (एचटीएमएल 5)। (बस toggle()) तत्वों रहने के "सच" इसी तरह अगर मैं जोड़ने toggle('slow') प्रपत्र तत्व हमेशा वापस लौटने -JQuery स्लाइड टॉगल समस्याएं

वहाँ किसी भी कारण है कि अगर मैं slideToggle() प्रपत्र प्रपत्र तत्व हमेशा वापस input type="text" पर वापस लौटने के लिए अभी तक अगर मैं toggle() है input type="text"

ठीक है। "पृष्ठ 1" पर HTML कोड इस तरह दिखता है:

<form method="post" id="frmcreate"> 
<ol></ol> 
<input type="submit" id="testit" /> 
</form> 

इसे इस तरह इस में लोड किया जाता है - हां दस्तावेज़ तैयार() आदि

$('ul#fieldtypes li a').click(function(){ 
var id_timestamp = new Date().getTime(); 
var id = $('.inputlength').length; 
$("#frmcreate ol").append('<li id='+id_timestamp+' class="inputlength"></li>'); 
$('#'+id_timestamp).load('test1.php?y='+id); 
return false; 

});

यह फार्म कि भरी हुई है है

Type <input type="text" name="fieldmeta<?php echo $y; ?>[type]" /> <?php echo $error; ?> 
<br/> 
Name <input type="text" name="fieldmeta<?php echo $y; ?>[name]" value="<?php echo $y; ?>" /> <?php echo $error; ?> 
<br/> 
<div class="optoggle">OPTIONS</div> 

ये "विकल्प" एक अन्य पेज से लोड कर रहे हैं:

<li>Cols<input type="number" name="fieldmeta<?php echo $y; ?>[cols]" /> <?php echo $error; ?></li> 
<li>Rows<input type="number" name="fieldmeta<?php echo $y; ?>[rows]" /> <?php echo $error; ?></li> 
<li>Size<input type="number" name="fieldmeta<?php echo $y; ?>[size]" /> <?php echo $error; ?></li> 

वे इस तरह लोड किए गए हैं:

$('.optoggle').live('click',function(){ 
    $(this).next('div').toggle(); 
}); 
+0

क्या आपने इस व्यवहार को विभिन्न ब्राउज़रों में देखा है? क्या यह वही है? – kubum

+0

हां, लेकिन अब "डबल चेकिंग" –

+0

रुचि रखने वालों के लिए डेमो: http://www.jsfiddle.net/KmMBd/ – Matt

उत्तर

0

पर एफएफ (3.6.13) यह क्रोम "संख्या" पर "टेक्स्ट" अलर्ट करता है।

लगता के रूप में एफएफ "संख्या" प्रकार पता नहीं है पाठ "" इसके बारे में डिफ़ॉल्ट में बदल जाती "।

0

यह आपकी समस्या की तरह लग रहा बातों का एक संयोजन है। मैं मदद करने के लिए इस अद्यतन बेला बना लिया है समस्याओं को प्रदर्शित करें: http://jsfiddle.net/KmMBd/10/

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

क्रोम में यह एक बग की तरह दिखता है। यह देखते हुए कि एचटीएमएल 5 अभी तक एक आधिकारिक मानक नहीं है, यह समझ में आता है, और एक बग रिपोर्ट के लिए एक शानदार अवसर है। ऐसा लगता है कि क्रोम इसे फिर से लिखने पर संख्या प्रकार को सही तरीके से प्रस्तुत नहीं करता है। पहेली में, यदि आप स्लाइड 1 को स्लाइड करते हैं, और फिर स्लाइड टॉगल 2, संख्या स्पिनर वापस आ जाएगा। यही कारण है कि मुझे लगता है कि इसे फिर से निकालने में एक समस्या है - बच्चे/अभिभावक सामान के साथ कुछ, मैं शर्त लगाता हूं। इस लिंक में क्रोम में बग की रिपोर्टिंग के बारे में जानकारी है: Report Chrome Bugs

सफारी में, समस्या थोड़ा अलग है। संख्या प्रकार समर्थित है, लेकिन वास्तव में संभाला नहीं है। संक्षेप में, इसका मतलब है कि सफारी पहचानता है कि इनपुट "टेक्स्ट" बॉक्स से अलग है, लेकिन वास्तव में उस जानकारी के साथ कुछ भी नहीं करता है। अनिवार्य रूप से, सफारी को फ़ायरफ़ॉक्स/आईई के समान ही व्यवहार करें।

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

1

@jwegner की तरह, आपकी समस्या jQuery के साथ नहीं है लेकिन ब्राउज़र के साथ एचटीएमएल 5 पर समर्थन है।

फिर से शुरू करना, आज Google क्रोम केवल <input type="number" /> को समझता है। मेरा मतलब है "केवल" क्योंकि यह अंतिम संस्करण पर करता है। फ़ायरफ़ॉक्स 4 और इंटरनेट एक्सप्लोरर 9 दोनों प्रोसेस करते हैं जो इस विशेषता को समझेंगे, लेकिन अब बीटा या आरसी पर हैं और इन पर विचार नहीं किया जा सकता है।

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

यह toggle() के साथ नहीं होता है क्योंकि माता-पिता एनिमेटेड नहीं है, बस छुपा हुआ है और फिर दिखाई देता है। लेकिन toggle("slow") के साथ एक एनीमेशन होता है, फिर वर्णित बग भी।

मैंने यहां एक वर्कअराउंड पोस्ट किया: http://jsfiddle.net/4fBvL/2/, यह इस पर आधारित है: स्लाइडिंग करते समय, आप एनिमेशन का उपयोग कर सकते हैं। लेकिन फिर से दिखाने के लिए, यह imediatelly होना चाहिए।

एक और वैकल्पिक हल fadeIn() और fadeOut() बजाय slideUp() और slideDown() उपयोग करने के लिए है। किसी कारण से, fades बग का कारण नहीं बनता है।

वैसे भी, सबसे अच्छा विकल्प अब type="number" से बचने के लिए है। आखिरकार, आप नहीं चाहते कि आपका पृष्ठ केवल क्रोम में काम करे, है ना?

+0

एरिक, बहुत धन्यवाद, महान टिप्पणी/ज्ञान/शोध। आप सही हैं कि मैं नहीं चाहता कि मेरे पेज केवल क्रोम में ही काम करें - यह देखने की उम्मीद कर रहा था कि मैं इसे प्रबंधित कर सकता हूं या नहीं। अपने बेवकूफ की जांच करेंगे - अभी तक नहीं किया। धन्यवाद –

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