दिलचस्प पोस्ट
एक फ्रीस्टैंडिंग वातावरण से कंप्यूटर को कैसे पावर करें? क्या JAXB समर्थन xsd: प्रतिबंध? सी ++ बहुत बड़े पूर्णांकों से निपटने टी-एसक्यूएल में लेवेनशटेन की दूरी एचटीएमएल स्क्रिप्ट टैग का इस्तेमाल कोड में करते समय करते हैं एमवीसी को समझना Php में एन एरेज़ के समन्वित मूल्य स्विफ्ट में निब से एक UIView लोड करें Inno सेटअप हमेशा व्यवस्थापक की AppData निर्देशिका में स्थापित करता है दृश्य स्टूडियो 2010 में सीयूडीए संकलक झंडे कैसे सेट करें? सभी धागा पूल अपने काम करने के लिए invokeAll () का उपयोग कैसे करें? सी # में दो या अधिक बाइट सरणियों को संयोजित करने का सर्वोत्तम तरीका एंड्रॉइड में बाहरी फोंट का उपयोग करें iPhone कोर डेटा की बचत करते समय अनसुलझे त्रुटि सी में एक यादृच्छिक दशमलव बनाने

क्या मैं एचटीएमएल 5 नंबर इनपुट के स्पिन बॉक्स को छिपा सकता हूं?

क्या नए स्पिन बक्से को छिपाने के लिए ब्राउज़रों में एक सुसंगत तरीका है, जो कुछ ब्राउज़रों (जैसे क्रोम) प्रकार के HTML इनपुट के लिए प्रस्तुत करता है? मैं ऊपर / नीचे तीर को प्रदर्शित होने से रोकने के लिए सीएसएस या जावास्क्रिप्ट विधि की तलाश कर रहा हूं।

<input id="test" type="number"> 

Solutions Collecting From Web of "क्या मैं एचटीएमएल 5 नंबर इनपुट के स्पिन बॉक्स को छिपा सकता हूं?"

यह सीएसएस प्रभावी रूप से वेबकिट ब्राउज़र के लिए स्पिन-बटन छुपाता है (इसे क्रोम 7.0.517.44 और सफारी संस्करण 5.0.2 (6533.18.5) में परीक्षण किया है):

 input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { /* display: none; <- Crashes Chrome on hover */ -webkit-appearance: none; margin: 0; /* <-- Apparently some margin are still there even though it's hidden */ } 

आप तत्वों के लिए मिलान किए गए सीएसएस गुणों को देखने के लिए हमेशा निरीक्षक (वेबकिट, फ़ायरफ़ॉक्स के लिए संभवतः फायरबग) का इस्तेमाल कर सकते हैं, छद्म elemnts के लिए देखें यह छवि इनपुट तत्व प्रकार = "संख्या" के परिणाम दिखाती है:

इनपुट प्रकार = संख्या (क्रोम) के लिए इंस्पेक्टर

फ़ायरफ़ॉक्स 29 वर्तमान में संख्या तत्वों के लिए समर्थन जोड़ता है, इसलिए वेबकिट और मोज़ के आधार पर ब्राउज़रों में स्पिनरों को छिपाने के लिए यह एक स्निपेट है:

 input[type='number'] { -moz-appearance:textfield; } input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; } 

संक्षिप्त जवाब:

 input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } input[type="number"] { -moz-appearance: textfield; } 
 <input type="number" /> 

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

 <input type="text" pattern="[0-9]*" /> 

\d* का एक pattern भी काम करेगा।

इसके बजाय input type="tel" का उपयोग करने का प्रयास करें यह संख्याओं के साथ एक कुंजीपटल पॉप अप करता है, और यह स्पिन बक्से नहीं दिखाती है इसके लिए जावास्क्रिप्ट या प्लगिन की आवश्यकता नहीं है

 input[type=number]::-webkit-outer-spin-button, input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } //Supports Mozilla input[type=number] { -moz-appearance:textfield; } <input type="number"/> 

मुझे input[type="datetime-local"] साथ इस समस्या का सामना करना पड़ा input[type="datetime-local"] , जो इस समस्या के समान है

और मुझे इस तरह की समस्याओं पर काबू पाने का एक रास्ता मिल गया है

सबसे पहले, आपको "DevTools -> सेटिंग -> सामान्य -> ​​तत्वों -> उपयोगकर्ता एजेंट छाया DOM दिखाएं" क्रोम की छाया-मूल सुविधा को चालू करना होगा

उसके बाद आप सभी छायांकित डोम तत्वों को देख सकते हैं, उदाहरण के लिए, <input type="number"> , छायांकित डोम के साथ पूर्ण तत्व है:

 <input type="number"> <div id="text-field-container" pseudo="-webkit-textfield-decoration-container"> <div id="editing-view-port"> <div id="inner-editor"></div> </div> <div pseudo="-webkit-inner-spin-button" id="spin"></div> </div> </input> 

आपके लिए क्या नहीं पूछा, लेकिन मैं स्पिनबॉक्स के साथ वेबकिट में एक फोकस बग के कारण ऐसा करता हूं:

 // temporary fix for focus bug with webkit input type=number ui if (navigator.userAgent.indexOf("AppleWebKit") > -1 && navigator.userAgent.indexOf("Mobile") == -1) { var els = document.querySelectorAll("input[type=number]"); for (var el in els) el.type = "text"; } 

इससे आपको क्या जरूरत पड़ने में मदद करने के लिए एक विचार दिया जा सकता है

उबंटू के लिए फ़ायरफ़ॉक्स पर, बस का उपयोग करके

  input[type='number'] { -moz-appearance:textfield; } 

मेरे लिए चाल किया

जोड़ा जा रहा है

 input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; } 

मुझे करने के लिए नेतृत्व करेंगे

अज्ञात छद्म वर्ग या छद्म तत्व '-विबिट-बाहरी-स्पिन-बटन' खराब चयनकर्ता के कारण रूलसेट पर ध्यान नहीं दिया।

हर बार मैंने कोशिश की आंतरिक स्पिन बटन के लिए भी यही है

 input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; 

सफारी में यह काम करने के लिए मैं जोड़ पाया! वेबकिट समायोजन के लिए महत्वपूर्ण स्पिन बटन को छिपी रखने के लिए मजबूर करता है

 input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { /* display: none; <- Crashes Chrome on hover */ -webkit-appearance: none !important; margin: 0; /* <-- Apparently some margin are still there even though it's hidden */ } 

मुझे ओपेरा के लिए एक समाधान के रूप में भी काम करने में परेशानी हो रही है

यह अधिक बेहतर जवाब है, मैं माउस पर माउस के बिना और बिना सुझाव देना चाहता हूं

 input[type='number'] { appearance: textfield; } input[type='number']::-webkit-inner-spin-button, input[type='number']::-webkit-outer-spin-button, input[type='number']:hover::-webkit-inner-spin-button, input[type='number']:hover::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } 

शायद जब आप एक स्पिनर नहीं चाहते हैं तो पाठ इनपुट में जावास्क्रिप्ट के साथ संख्या इनपुट बदलना;

 document.getElementById('myinput').type = 'text'; 

और उपयोगकर्ता को प्रवेश करने से रोकें;

  document.getElementById('myinput').onkeydown = function(e) { if(!((e.keyCode > 95 && e.keyCode < 106) || (e.keyCode > 47 && e.keyCode < 58) || e.keyCode == 8 || e.keyCode == 9)) { return false; } } 

तो फिर जावास्क्रिप्ट इसे बदलने के मामले में आप एक स्पिनर चाहते हैं;

 document.getElementById('myinput').type = 'number'; 

यह मेरे उद्देश्यों के लिए अच्छी तरह से काम किया

आप सामग्री का प्रयोग कर रहे हैं कि विनिर्देश अंतिम नहीं है, इसलिए मैं कहूंगा कि यह तय करने के लिए एक पूरी तरह से संगत, क्रॉस-ब्राउज़र तरीका होगा।

बस इनपुट प्रकार = "टेक्स्ट" का उपयोग करें, और यह सुनिश्चित करने के लिए जावास्क्रिप्ट मान्यता का एक रूप का उपयोग करें कि यह एक संख्या है