javascript - Select the content of input / textbox field on tap / click -


एक चयन योग्य टेक्स्टबॉक्स के लिए मेरा राज्य


चुनौती:

क्लिक / नल पर इसकी सामग्री का चयन कर सकते हैं 'किसी भी' प्रकार का एक क्रॉस ब्राउज़र टेक्स्टबॉक्स / इनपुट फ़ील्ड बनाना।

एक समस्या जो कई

समस्या:

जब कोई स्पर्श डिवाइस का उपयोग करता है तो नल ईवेंट आग लगाता है जब माउस ईवेंट पर क्लिक करें Apple डिवाइसों पर टैप ईवेंट onclick या onfocus को आग नहीं करता है। यह एक सफ़ारी विशिष्ट समस्या नहीं है क्योंकि Google क्रोम के पास एप्पल डिवाइस पर एक ही समस्या है लेकिन एंड्रॉइड डिवाइस पर नहीं


पाठ का चयन करने का मानक तरीका केवल इसका उपयोग करना है:

  $ ('इनपुट' )। फ़ोकस (फ़ंक्शन () {$ (यह)। चयन ();});  

स्टैक अतिप्रवाह पर उल्लेखित एक अन्य चयनित कार्य है:

  $ ('input')। फ़ोकस (फ़ंक्शन () {this.select (); // कोई jquery आवरण})। माउसउप (फ़ंक्शन (ई) {e.preventDefault ();});  

दोनों अच्छे तरीके से काम करते हैं लेकिन एप्पल उपकरणों पर काम नहीं करते हैं।

मुझे मिल गया एकमात्र काम करने वाला समाधान इस के अनुसार एक चयन श्रेणी बनाना है। यह शुद्ध जावास्क्रिप्ट है और महान काम करता है।

  $ ('इनपुट')। क्लिक करें (फ़ंक्शन () {document.getElementById ('आईडी')। चयनस्टार्ट = 0 document.getElementById ('ID' )। चयन विकल्प = 99 9});  

मास्टर सॉल्यूशन

इस सभी ज्ञान के साथ मैं यहाँ अपने स्वयं के एक संयोजन के समाधान के साथ आया था।

  $ ('select') फ़ोकस (फ़ंक्शन () {this.select (); this.setSelectionRange (0, 99 99);})। माउसउप (फ़ंक्शन (e) {e.preventDefault ( );});  

समस्या की समीक्षा

यह एक लंबे समय तक खड़ी समस्या है जिसे मैंने सोचा था कि हल हो गया है लेकिन अब हम 2016 तक पहुंच जाते हैं और समस्या चलती मृतों की तरह धरती से बढ़ती है।

अब स्पष्ट रूप से यह कहा गया है:

आप 'setinselectrange' को 'HTMLInputElement' पर नहीं उपयोग कर सकते हैं: इनपुट तत्व का प्रकार (' संख्या ') चयन का समर्थन नहीं करता है।

इसलिए मुख्य कोड अब सेब उपकरणों के नंबर फ़ील्ड पर काम नहीं करेगा।

यहां हम फिर से हैं और यह समय है मामले पर कुछ बाउंटी हंटर्स प्राप्त करें!

महत्वपूर्ण अतिरिक्त सूचना: मुझे सेब से नफरत है।


  $ ('। .mouseup (फ़ंक्शन (e) {e.preventDefault (); });  
  & lt; script src = "https://ajax.googleapis.com/ajax/ libs / jQuery / 2.1.1 / jquery.min.js "& gt; & lt; / स्क्रिप्ट & gt; इनपुट टाइप टेक्स्ट & lt; br / & gt; & lt; इनपुट प्रकार = "टेक्स्ट" मान = "मुझे क्लिक करें" वर्ग = "चुनें" & gt; & Lt; br / & gt; इनपुट प्रकार संख्या & lt; br / & gt; इनपुट प्रकार = "संख्या" मान = "0" वर्ग = "चुनें" & gt; & Lt; br / & gt; मैं सेब पसंद नहीं है।  

दो ईवेंट टैप करें और क्लिक करें विभिन्न मोबाइल ओएस के पास दो घटनाओं को मानचित्रित करने का तरीका है। न केवल, अलग-अलग तरीकों से टैप के साथ एंड्रॉइड और आईओएस मानचित्र हॉवर इवेंट पर क्लिक करें यह कुछ समय पहले की तरह है जहां विभिन्न ब्राउज़रों में जावास्क्रिप्ट का अलग सेट होता है और इस समस्या का समाधान करने के लिए jquery है।

तो, मेरा सुझाव है कि आप इसे प्रबंधित करने के लिए hammer.js नामक लाइब्रेरी का उपयोग करें।

<पूर्व> var hammertime = नया हैमर ($ ("परीक्षण") [0]); Hammertime.on ('टैप', फ़ंक्शन (ईव) {event.target.selectionStart = 0 event.target.selectionEnd = 999}); वार हैम्र्टमी 2 = नया हैमर ($ (".2 परीक्षण") [0]); Hammertime2.on ('टैप', फ़ंक्शन (ev) {$ (event.target)। चयन करें (), संख्या इनपुट का चयन करने के लिए, इस विधि का उपयोग करें});


Comments

Popular posts from this blog

winforms - C# Form - Property Change -

java - Messages from .properties file do not display UTF-8 characters -

javascript - amcharts makechart not working -