क्या टच ईवेंट आईपैड सफारी में टेक्स्ट-इनपुट तत्वों के साथ काम नहीं करते हैं?

Question

आईपैड सफारी में, मैंने एक डीवीवी के टच-इवेंट प्रोग्राम किए हैं ताकि जब आप डीआईवी के अंदर छूएं और 500   एमएस के लिए अपनी उंगली पकड़ लें, डीआईवी का पृष्ठभूमि रंग बदलता है।

जब मैं कोड को टेक्स्ट-इनपुट तत्व (फ़ील्ड्स के अंदर) में स्थानांतरित करने का प्रयास करता हूं, तो इसे DIV के बजाय स्पर्श-लक्ष्य बना देता है, कोड काम नहीं करता है। पाठ इनपुट इस सीएसएस के बावजूद चयनित हो जाता है:

input[type=text] {-webkit-touch-callout:none; -webkit-user-select:none } 

वहाँ iPad सफारी में एक पाठ-इनपुट तत्व के स्पर्श की घटनाओं को रोकने और उन्हें एक कस्टम ढंग से संभाल, डिफ़ॉल्ट व्यवहार को रोकने के लिए कोई रास्ता नहीं है? या क्या कुछ अतिरिक्त है जो मुझे समर्थन देने के लिए इनपुट प्राप्त करने के लिए करना चाहिए? मैंने डमी क्लिक हैंडलर के साथ और बिना कोशिश की है: ऑनक्लिक = "शून्य (0)"।

यह दस्तावेज़ मैं प्रलेखन Handling Events अनुसरण कर रहा हूँ है।

Answer 1

यदि आप अपना कोड पोस्ट करते हैं तो यह सहायक होगा, लेकिन मुझे लगता है कि आपको शायद स्पर्श घटनाओं पर डिफ़ॉल्ट व्यवहार को रोकने की आवश्यकता है। यह कुछ इस तरह दिखता है, तो jQuery का उपयोग कर:

$("#ID") 
     .bind("touchstart", 
      function (e) { 
       e.preventDefault(); 
       //do something 
      }) 
     .bind("touchmove", 
      function (e) { 
       if (e.preventDefault) { 
        e.preventDefault(); 
       } 
       //do something 
      }); 

Answer 2

कोशिश अक्षम करें और केवल पढ़ने के लिए अपने इनपुट बनाने के लिए:

<input type="text" readonly /> 

Answer 3

आप अपने हैंडलर कोड में preventDefault() फोन नहीं करते हैं, तो ब्राउज़र स्वत: पारित करेंगे डिफ़ॉल्ट कार्यान्वयन के माध्यम से ईवेंट स्पर्श करें (आपको लगता है कि आपने इसे संभाला है)। डिफ़ॉल्ट कार्यान्वयन क्षेत्र का चयन करना है।

तो, आपके मामले में, अपने हैंडलर में preventDefault() और stopPropagation() कहते हैं, और झूठी वापसी। यह घटना को आगे बुलबुले से रोकता है। फिर आप अपने इनपुट तत्व को पूरी तरह से नियंत्रित कर सकते हैं।

चेतावनी: फिर आप भी इनपुट क्षेत्र के डिफ़ॉल्ट व्यवहार को खो देंगे! दूसरे शब्दों में, आप फ़ील्ड में टेक्स्ट इनपुट करने में सक्षम नहीं होंगे! या यदि इनपुट क्षेत्र एक <select> है, तो आप सूची से निकालने के लिए सक्षम नहीं होगा आदि

मुझे लगता है आप वास्तव में क्या चाहते हैं: उपयोगकर्ता प्रेस और 500ms के लिए पकड़ 1) है, तो पीले रंग के हो, 2) और/या रिलीज पर इनपुट फ़ील्ड को सक्रिय करें। उस स्थिति में, जब आप वास्तव में इनपुट फ़ील्ड का उपयोग करना चाहते हैं तो आपको ईवेंट को मैन्युअल रूप से पुनर्प्राप्त करना होगा।

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