2012-04-06 4 views
6

मैं इस कोड को विंडोज 7 पर फ़ायरफ़ॉक्स 11 में चला रहा हूं। (http://jsfiddle.net/QStkd/ देखें)।jqueryui संवाद फ़ायरफ़ॉक्स में 'चयन() `इनपुट करने में सक्षम नहीं है 11

$('<div><input type="text" value="val" /></div>').dialog(); 

इनपुट में मूल्य चयनित नहीं है, है जो क्रोम और IE में क्या करता है, यह भी है कि अगर मैं मैन्युअल select() विधि कॉल काम नहीं करता।

क्या यह ज्ञात समस्या है? क्या इसका चयन करने का कोई तरीका है? Timers work लेकिन यदि मैं लोड होने के बाद jsfiddle पर run पर क्लिक करता हूं तो यह अब काम नहीं करता है।

उत्तर

3

ऐसा लगता है कि क्रोम पर focus() (जो jquery-ui डिफ़ॉल्ट रूप से पहले टैबबेल तत्व पर डिफ़ॉल्ट रूप से करता है) को कॉल करता है (ओएस एक्स पर आईई का परीक्षण नहीं कर सकता) बॉक्स पर केंद्रित है और बॉक्स के अंदर टेक्स्ट का चयन करता है।

jquery.dialog.ui.js से लिया:

// set focus to the first tabbable element in the content area or the first button 
// if there are no tabbable elements, set focus on the dialog itself 
$(self.element.find(':tabbable').get().concat(
    uiDialog.find('.ui-dialog-buttonpane :tabbable').get().concat(
     uiDialog.get()))).eq(0).focus(); 

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

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

संपादित करें: (क्षमा करें, देर हो चुकी है) ऐसा लगता है कि "समस्या" का मूल कारण फ़ायरफ़ॉक्स है। सुनिश्चित नहीं है कि यह डिज़ाइन किया गया है या नहीं, लेकिन जो मैं देख सकता हूं, ऐसा लगता है कि फ़ायरफ़ॉक्स उसी पृष्ठ पर एक ही समय में विभिन्न सामग्री पैन के भीतर दो अलग-अलग इनपुट तत्वों में चयनित होने के लिए टेक्स्ट को अनुमति नहीं देगा। यह क्रोम को प्रभावित नहीं करता है (और, अनुमानतः, आईई 9)।

मैंने स्थानीय रूप से एक त्वरित उदाहरण बनाया है जिसमें दो आईफ्रेम साइड हैं (चलो उन्हें बाएं और दाएं कॉल करें)। बाएं में एक टेक्स्टरेरा होता है, और दाएं आपके jquery-ui संवाद होते हैं - आपके द्वारा पोस्ट की गई पहेली के समान।

<script type="text/javascript"> 
setTimeout(function() { 
    $('textarea').focus(); 
}, 1000); 
</script> 

आप इन एक साथ टुकड़ा और फ़ायरफ़ॉक्स में परिणाम की जाँच करते हैं, तो आप देखेंगे कि इनपुट केंद्रित है और चयन किया जाता है:

<script type="text/javascript"> 
$('<div><input type="text" value="val" /></div>').dialog(); 
$('input').select(); 
</script> 

बाईं निम्नलिखित कोड है: सही निम्नलिखित कोड है जब तक बाईं ओर textarea केंद्रित नहीं है। मुझे लगता है कि जेएसफ़िल्ड में ऐसा कुछ हो रहा है।

+0

+1 एक अच्छी तरह से लिखित उत्तर के लिए, तो क्या इसके लिए कोई फिक्स है? – qwertymk

+0

मुझे इसे और देखने का मौका नहीं मिला है। मैं कहूंगा कि यह संभव है कि यह फ़ायरफ़ॉक्स में एक बग है। क्या आपने इसके बारे में कुछ और खोजा है या समाधान ढूंढना समाप्त कर दिया है? – chrisn

+0

कुछ भी सिद्धांतों का एक समूह निश्चित नहीं है। मैं इस पर तौलिया में फेंकने वाला हूं और इस तथ्य के साथ शांति बनाएगा कि विभिन्न ब्राउज़रों को अलग-अलग उक्स मिलेगा – qwertymk

2

यूई संवाद की open घटना का उपयोग करने का प्रयास करें। जब संवाद खोला जाता है तो यह ईवेंट ट्रिगर होता है।

$('<div><input id="yourInput" type="text" value="val" /></div>').dialog({ 
    open:function(){ 
    $("#yourInput").focus().select(); 
    } 
     } 
) 

http://jsfiddle.net/sergeir82/A6Wah/8/

http://jsbin.com/etivej/4/

0

यह डोम आप DOCTYPE सेट किया है निर्धारित करने में एक एफएफ मुद्दा है। इसे ठीक करने का कोई शानदार तरीका नहीं है, फोकस करने वाला टाइमर "चारों ओर हैक" होता है।हालांकि एक और कदम है, यदि आपका डॉक्टर टाइप 3 एक्सएचटीएमएल मानकों पर सेट है तो आप इसे फोकस पर चुनने के लिए this का उपयोग कर सकते हैं। अपने इनपुट की संपत्ति के रूप में onfocus="this.select();" जोड़ें, ताकि जब यह ध्यान केंद्रित किया जाए, तो तुरंत इसे चुना जाता है।

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