टेक्स्ट बॉक्स को ब्लिंक करने वाले टेक्स्ट बॉक्स को कैसे छिपाना है?

Question

मुझे सीएसएस/जावास्क्रिप्ट में कर्सर को ब्लिंक करने वाले टेक्स्ट बॉक्स को छिपाने की जरूरत है।

क्या यह संभव है?

Answer 1

<input type=text disabled="disabled"/> 

क्योंकि मुझे ऐसा कोई अन्य कारण नहीं दिख रहा है जिसे आप ऐसा करना चाहते हैं।

संपादित करें:

मैं आप उपयोगकर्ता पाठ क्षेत्र से बड़ी है कि स्क्रॉल करने के लिए अनुमति देना चाहते हैं लगता है , लेकिन निमिष नहीं दिखा?

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

अब, यदि आप अभी भी उपयोगकर्ता को सभी सामग्री देखने की अनुमति देना चाहते हैं, तो आपको सामग्री के रूप में इनपुट को बड़ा करना होगा। वहां से कोई भाग नहीं रहा है।

और फिर सीएसएस overflow: hidden या scroll साथ एक माता पिता div साथ आकार को सीमित।

<div style="overflow: scroll-x;"><input size=255 value="some string 255 char long" /></div> 

Answer 2

तो टेक्स्ट बॉक्स पर एक maxlength सेट और फिर text-indent का उपयोग maxlength से कर्सर वापस अधिक वर्ण स्थानांतरित करने के लिए कर सकता है।

उदाहरण के लिए, आप maxlength=20 सेट कर सकते हैं और फिर टेक्स्ट बॉक्स text-indent: -20em सेट कर सकते हैं जिस तरह से टेक्स्ट बॉक्स की सीमाओं से बाहर निकलता है और कभी भी इसे देखने में नहीं आता है।

Answer 3

यह बहुत पुराना है, लेकिन मैं बस इसी तरह के मुद्दे से निपट रहा था। ब्राउज़र का समर्थन करने वाले (अर्थात्, IE8 नहीं), आप इनपुट तत्व का रंग अपनी पृष्ठभूमि (शायद सफेद) के समान सेट कर सकते हैं, और फिर कर्सर अदृश्य हो जाएगा।

Answer 4

कर्सर को पृष्ठभूमि के समान रंग बनाएं?

Answer 5

यहाँ एक और सवाल से मेरा समाधान है, कि मैं पहले से ही उत्तर दिया:

https://stackoverflow.com/a/23472096/1806628

---

मूल विचार है, कि कर्सर का रंग पाठ के रंग के समान है। तो सबसे पहले आप पाठ को पारदर्शी बनाते हैं, इस प्रकार कर्सर को इसके साथ ले जाते हैं। फिर आप पाठ छाया के साथ पाठ को फिर से दृश्यमान बना सकते हैं।

 
input[type="text"]{ 
    color : transparent; 
    text-shadow : 0 0 0 #000; 
} 
input[type="text"]:focus{ 
    outline : none; 
} 

चेतावनी:

यह आईओएस 8. (धन्यवाद जानकारी के लिए @Altaveron)

---

मेरी है थोड़ा अधिक hacky का एक और विचार है और के तहत काम करने के लिए प्रतीत नहीं होता जावास्क्रिप्ट की आवश्यकता है।

HTML और सीएसएस हिस्सा:

आप 2 इनपुट फ़ील्ड है और वास्तव में z- सूचकांक, आदि के साथ दूसरे के शीर्ष पर स्थिति एक बनाने केफिर आप शीर्ष इनपुट फ़ील्ड को पूरी तरह से पारदर्शी बनाते हैं, कोई फोकस नहीं, कोई रंग नहीं, और समान रूप से। आपको दृश्यमान, निचले इनपुट को अक्षम करने की आवश्यकता है, ताकि यह केवल उपर्युक्त इनपुट की सामग्री दिखाए, लेकिन वास्तव में काम नहीं करता है।

जावास्क्रिप्ट हिस्सा:

के बाद आप सब से ऊपर दो आदानों सिंक। कीप्रेस या परिवर्तन पर आप उच्च इनपुट की सामग्री को निचले स्तर पर कॉपी करते हैं।

उपर्युक्त सभी को सारांशित करना: आप एक अदृश्य इनपुट टाइप करते हैं, और फॉर्म सबमिट होने पर बैकएंड को भेजा जाएगा, लेकिन इसमें पाठ के प्रत्येक अपडेट को निम्न दृश्यमान, लेकिन अक्षम इनपुट फ़ील्ड में प्रतिबिंबित किया जाएगा।

Answer 6

यदि यह उस पर readonly = "readonly" विशेषता के साथ एक इनपुट है, तो आईओएस पर सफारी अभी भी एक फिसलने वाला कर्सर दिखाता है जब उस पर ध्यान केंद्रित किया जाता है।

-webkit-user-select: none; 
user-select: none;