प्रोग्राम को iOS उपकरणों (मोबाइल सफारी) पर इनपुट क्षेत्र में पाठ का चयन करना

87

आप iOS उपकरणों, जैसे iPhone, iPad पर मोबाइल सफारी चलाने वाले इनपुट क्षेत्र के पाठ का प्रोग्रामेटिक रूप से चयन कैसे करते हैं?

आम तौर पर यह तत्व .select()पर फ़ंक्शन को कॉल करने के लिए पर्याप्त है <input ... />, लेकिन यह उन उपकरणों पर काम नहीं करता है। कर्सर को मौजूदा प्रविष्टि के अंत में छोड़ दिया गया है जिसमें कोई चयन नहीं किया गया है।

javascript  iphone  html  safari  ios 
— sroebuck
स्रोत
10
मुझे कोई कारण नहीं दिखता कि स्पर्श डिवाइस होने के कारण पूर्व-चयन पाठ की प्रासंगिकता बदल जाती है। आपने एक टच डिवाइस के बारे में जो कहा है वह समान रूप से एक गैर-टच डिवाइस के बारे में कहा जा सकता है। जब उपयोगकर्ता किसी आइटम को संपादित करने के लिए उसे चुनना चाहता है, तो मैं पाठ का चयन करना चाहता हूं। ज्यादातर मामलों में उपयोगकर्ता मौजूदा सामग्रियों को बदलना चाहते हैं जिस स्थिति में वे ऐसा करने में सक्षम होंगे, बिना किसी और स्पर्श और खींच के। अन्य मामलों में जब वे मौजूदा सामग्री को संपादित करना चाहते हैं तो वे चयन को रद्द या परिवर्तित करने में सक्षम होंगे।
— 15
2
दुर्भाग्य से .focus ()। चयन () काम नहीं करता है।
— १५:३० पर
2
मैं इस मुद्दे पर एक इनाम शुरू कर रहा हूं। मेरा लक्ष्य उपयोगकर्ताओं को मेरे टेक्स्टारिया पर क्लिक करना और क्लिपबोर्ड पर पाठ को कॉपी करने के लिए "कॉपी" पर टैप करना बहुत आसान बनाना है।
— डैन फेबुलिच
यहाँ भी .. मोबाइल सफारी में काम नहीं कर रहे बहुत सारे मेथोड्स प्रतीत होते हैं। सेलेक्ट () और .focus () उनमें से दो हैं।
डेविड डब्ल्यू कीथ के लिए @sroebuck अच्छा जवाब! थम्स अप!
— आंखों की रोशनी

जवाबों:

95 
input.setSelectionRange(0, 9999);

https://developer.mozilla.org/en/DOM/Input.select

— jobwat
स्रोत
3
इसने मेरे लिए काम किया लेकिन माउस को उसी इनपुट पर रोकना शामिल था।
— ड्यूस्टॉर्म
8
यह मेरे लिए आईपैड या आईफोन दोनों पर काम नहीं करता था
— डॉग
4
यह केवल मेरे लिए काम करता है अगर मैं .focus()आह्वान करने से पहले इनपुट पर ट्रिगर हो जाता हूं input.setSelectionRange। यदि आप focusइनपुट पर ईवेंट के लिए सुन रहे हैं , तो अनंत लूप का ध्यान रखें।
— एलीफेर्र
10
एक गोटा जो ध्यान देने योग्य है: यह उनके readonlyगुण सेट होने पर textareas पर काम नहीं करेगा ।
— JayPea
5
मैंने विभिन्न समाधानों के साथ खेलते हुए एक घंटे से अधिक समय बिताया। हैंडलर setSelectionRange()में कॉल करना focusतब काम करता है जब आप .focus()प्रोग्रामेटिक रूप से ट्रिगर होते हैं , लेकिन जब आप मैन्युअल रूप से iOS पर टेक्स्ट इनपुट में टैप करते हैं, तो सिलेक्शन नहीं होता है। यह कहने के लिए पर्याप्त है, आपको केवल setSelectionRange()0 के सेटटाइमआउट के भीतर कॉल करने की आवश्यकता है और यह ध्यान केंद्रित करने पर कोई फर्क नहीं पड़ता कि अपेक्षित रूप से काम करता है।
30

इस सूत्र में कुछ भी मेरे लिए काम नहीं किया, यहाँ मेरे iPad पर क्या काम किया गया है:

// t is the input field
setTimeout(function() {
    t.setSelectionRange(0, 9999);
}, 1);
— nkrop
स्रोत
यह च ** परिजनों की चाल है! धन्यवाद!
— साईक
बहुत बहुत धन्यवाद!!
— वेक्काल कुसक
26

एक नकारात्मक साबित करना मुश्किल है, लेकिन मेरा शोध बताता है कि यह मोबाइल सफारी में एक बग है।

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

आपकी सर्वश्रेष्ठ शर्त Apple के साथ बग रिपोर्ट हो सकती है ।

— clozach
स्रोत
1
हमारे परीक्षण से संकेत मिलता है। यह मोबाइल सफारी में एक बग / लापता-सुविधा है।
— निर लेवी
2
FWIW, यह क्रोम डेस्कटॉप और एंड्रॉइड ब्राउज़र में काम करता है, जो कि WebKit पर भी आधारित है।
— जुर्मेल
24

इस फिडेल को देखें : (इनपुट बॉक्स में कुछ पाठ दर्ज करें और 'पाठ का चयन करें' पर क्लिक करें)

यह मेरे iPod (5th gen iOS6.0.1) पर एक इनपुटबॉक्स में पाठ का चयन कर रहा है, कीबोर्ड खोल रहा है और कट / कॉपी / सुझाव ... मेनू भी दिखा रहा है

सादे जावास्क्रिप्ट का उपयोग करना। JQuery के साथ यह कोशिश नहीं की

document.getElementById("p1").selectionStart = 0
document.getElementById("p1").selectionEnd = 999

ध्यान दें कि संख्या 999 केवल एक नमूना है। आपको इन संख्याओं को उन वर्णों की संख्या पर सेट करना चाहिए जिन्हें आप चुनना चाहते हैं।

अपडेट करें:

  • iPod5 - iOS6.0.1 - ठीक काम कर रहा है।
  • iPad1 - iOS5.1.1 - केवल पाठ चयनित। कट / कॉपी मेनू खोलने के लिए एक बार चयन टैप करें
  • iPad2 - iOS4.3.3 - केवल पाठ चयनित। कट / कॉपी मेनू खोलने के लिए एक बार चयन टैप करें

अंतिम दो के लिए, आप inputतत्व पर एक क्लिक ईवेंट ट्रिगर करके प्रयोग कर सकते हैं

अद्यतन: (07-10-2013)

  • iPod5 - iOS7.0.2 - लिंक में फिडेल का उपयोग करना: इनपुट बॉक्स में टाइप किया हुआ पाठ नहीं देख सकते। चुनिंदा रीडायरेक्ट मुझे facebook.com पर भेज देता है (??? wtf ???) पता नहीं वहां क्या चल रहा है।

अद्यतन: (14-11-2013)

  • iOS 7.0.3: बिंकी अपडेट से टिप्पणी के लिए धन्यवाद कि यह .selectionStartऔर काम .selectionEnd करता है ।

अद्यतन: (15-01-2015)

  • iOS 8.xx: माइकल सीबर्ट की टिप्पणी के लिए धन्यवाद । टिप्पणी से लिया गया: मुझे ध्यान केंद्रित करने और घटनाओं पर क्लिक करने और फिर सेटटाइमआउट / _ दोनों के लिए सुनना था। इसे दोनों मामलों में काम करने के लिए बहस करें: इनपुट पर क्लिक करें या टैबिंग के माध्यम से ध्यान केंद्रित करें
— bart s
स्रोत
आप आज के लिए मेरे हीरो हैं! एक जादू की तरह काम करता है! ;-)
— andi1984
3
@ @i1984 मैं नायक बैज का दावा कहां करूं?
— bart s
1
क्या आप अन्य iOS संस्करणों के लिए संगतता के बारे में जानते हैं? क्या यह iOS5 और iOS4 पर काम करता है?
— औरी
1
IOS6 BUT पर मेरे लिए काम करता है a) डेस्कटॉप पर काम नहीं करता है Chrome b) पाठ इनपुट के निष्क्रिय होने पर काम नहीं करता है :( मेरा उपयोग मामला: मैं अद्वितीय URL उत्पन्न करता हूं और इसे साझा करना चाहता हूं।
— मंगल रॉबर्ट्सन
1
@barts मैं अनुमान लगाने जा रहा हूं कि आप फेसबुक पर समाप्त हो गए क्योंकि jsfiddle पर "शेयर" मेनू को गड़बड़ करना चाहिए और संभवतया अदृश्य होते समय टैप किया जा सकता है। IPad पर iOS-7.0.3 के साथ परीक्षण करने पर मैंने स्वयं अदृश्य ट्विटर बटन पर क्लिक करना समाप्त कर दिया। मैंने यह भी पाया कि जब मुझे लगा कि मैं आपके ऊपर टैप कर रहा हूं <input/>, तो iPad ने सोचा कि मैं jsfiddle के "CSS" पेन (जिसमें मैंने जो भी टाइप किया था, वह अदृश्य था) में टैप कर रहा था। एक बार जब मैंने अपना नल सही पर निर्देशित किया <input/>, तो आपका "चुनिंदा पाठ" बटन iOS-7.0.3 :-) पर पूरी तरह से ठीक काम करता है।
— बिंकी
7

क्षमा करें, अपने पहले के पोस्ट में, मैंने जावास्क्रिप्ट का यह ध्यान नहीं दिया कि आप जावास्क्रिप्ट में उत्तर चाहते हैं।

जावास्क्रिप्ट के साथ UIWebView में आप क्या चाहते हैं, यह जानने के लिए , मैंने इसे काम करने के लिए जानकारी के दो महत्वपूर्ण टुकड़ों को एक साथ परिमार्जन करने में कामयाब रहा है। मोबाइल ब्राउज़र के बारे में निश्चित नहीं है।

  1. element.setSelectionRange(0,9999); हम जो चाहते हैं

  2. माउसअप इवेंट चयन को पूर्ववत कर रहा है

इस प्रकार (प्रोटोटाइप का उपयोग करके): 

    input.observe ('फोकस', फ़ंक्शन () {
      this.setSelectionRange (0, 9999);
    });
    input.observe ('माउसअप', फंक्शन (इवेंट) {
      event.stop ();
    });

उसने चाल चली।

मैट

— मैट
स्रोत
3
हम एक ही समस्या कर रहे हैं और पाया कि आपका समाधान काम कर रहा है - लेकिन हम jquery (वास्तव में मोबाइल) का उपयोग कर रहे हैं। / * भरे गए इन्स के अंदर पाठ का चयन करें * / $ ("इनपुट")। फ़ोकस (फ़ंक्शन () {this.setSelectionRange (0, 9999); गलत लौटें;}) .mouseup (फ़ंक्शन () {{असत्य;} );
— ड्यूस्टॉर्म
1
मैं iPad और iPhone पर iOS 8 का उपयोग कर रहा हूं, और @DuStorm से कोड (इस एक के ऊपर एक टिप्पणी) केवल एक चीज है जिसने मेरे लिए यहां दिए गए सभी उत्तरों में से काम किया। दोहराना करने के लिए, क्रोम और सफारी में iOS 8 पर कम से कम काम करता है: $("input").focus(function () { this.setSelectionRange(0, 9999); return false; } ).mouseup( function () { return false; });
— आरोन जेसन
focusinआईओएस 7
— लुकास
3

ऐसा लगता है कि फ़ोकस काम करेगा लेकिन केवल तब जब सीधे किसी मूल घटना से बुलाया जाए। सेटटाइमआउट जैसी किसी चीज़ का उपयोग करके कॉलिंग फोकस कीबोर्ड को कॉल नहीं करता है। Ios कीबोर्ड का नियंत्रण बहुत खराब है। इसकी अच्छी स्थिति नहीं है।

— yodaisgreen
स्रोत
1

एंड्रॉइड 2.2 के साथ आने वाले वेबकिट पर मेरे लिए निम्नलिखित कुछ मेरे लिए काम कर रहा है:

function trySelect(el) {
    setTimeout(function() {
        try {
            el.select();
        } catch (e) {
        }
    }, 0);
}

क्रोमियम अंक 32865 देखें ।

— robocat
स्रोत
1

IPad पर iOS 7 के साथ एकमात्र तरीका जो मैं यह काम करने में सक्षम था, वह वास्तव <textarea></textarea>में <input>क्षेत्र के बजाय उपयोग करना था ।

जैसे

<textarea onclick="this.setSelectionRange(0, 9999);">My text will be selected when textarea is clicked.</textarea>

उपयोगकर्ता को क्षेत्र के अंदर पाठ को बदलने से कैसे रोका जाए, यह अधिक कठिन था, क्योंकि आप टेक्स्टरी को आसानी से बनाते हैं, चयन चाल अब काम नहीं करेगी।

— मिकेल लेपिस्टॉ
स्रोत
1

मैं इस समाधान की तलाश में पागल हो गया, जबकि आपकी सभी प्रतिक्रियाओं ने मेरे लिए कीड़े के एक और डिब्बे को खोलने में मदद की।

क्लाइंट चाहता था कि उपयोगकर्ता क्लिक करने और सभी का चयन करने में सक्षम हो , और उपयोगकर्ता को 'टैब' भी करने दें और सभी iPad पर चुनें (बाहरी कीबोर्ड के साथ। मुझे पता है, पागल ...)

इस समस्या का मेरा समाधान था, घटनाओं को फिर से व्यवस्थित करना। प्रथम फोकस , फिर क्लिक करें , फिर टचस्टार्ट ।

$('#myFUBARid').on('focus click touchstart', function(e){
  $(this).get(0).setSelectionRange(0,9999);
  //$(this).css("color", "blue");
  e.preventDefault();
});

मुझे आशा है कि यह किसी की मदद करता है, क्योंकि आपने मुझे अनगिनत बार मदद की है।

— अदनान तारिक
स्रोत
-4

यदि आप HTML5- अनुरूप ब्राउज़र का उपयोग कर रहे हैं, तो आप placeholder="xxx"अपने inputटैग में उपयोग कर सकते हैं । वह काम करना चाहिए।

— DrMad
स्रोत
8
मुझे नहीं लगता कि यह प्रश्न क्या पूछ रहा था
— caitriona
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.