HTML फ़ॉर्म इनपुट फ़ील्ड के लिए अक्षम "= अक्षम" और आसानी से = "आसानी से" के बीच अंतर क्या है?


435

मैंने इस पर थोड़ा पढ़ा है, लेकिन मैं इस बारे में कुछ भी ठोस नहीं जान सकता कि विभिन्न ब्राउजर चीजों का इलाज कैसे करते हैं।


संबंधित: "कैसे चुनिंदा टैग के लिए आसानी से विशेषता का अनुकरण करें, और अभी भी POST डेटा प्राप्त करें?" stackoverflow.com/questions/368813/…
Adrien Be

जवाबों:


728

एक readonlyतत्व सिर्फ संपादन योग्य नहीं है, लेकिन जब formसबमेट्स के अनुसार भेजा जाता है । एक disabledतत्व संपादन योग्य नहीं है और सबमिट पर नहीं भेजा जाता है। एक और अंतर यह है कि readonlyतत्वों को केंद्रित किया जा सकता है (और ध्यान केंद्रित किया जा सकता है जब "टैबिंग" एक फॉर्म के माध्यम से) जबकि disabledतत्व नहीं कर सकते।

इस महान लेख या w3c द्वारा परिभाषा में इसके बारे में और पढ़ें । महत्वपूर्ण भाग उद्धृत करने के लिए:

मुख्य अंतर

विकलांग विशेषता

  • अक्षम किए गए फ़ॉर्म तत्वों के लिए मान प्रोसेसर विधि से पारित नहीं होते हैं। W3C इसे एक सफल तत्व कहता है। (यह चेक बॉक्स बनाने के समान है जो चेक नहीं किए जाते हैं।)
  • कुछ ब्राउज़र अक्षम फ़ॉर्म तत्वों के लिए डिफ़ॉल्ट स्टाइल को ओवरराइड या प्रदान कर सकते हैं। (ग्रे आउट या एम्बॉस टेक्स्ट) इंटरनेट एक्सप्लोरर 5.5 इस बारे में विशेष रूप से बुरा है।
  • अक्षम प्रपत्र तत्व फ़ोकस प्राप्त नहीं करते हैं।
  • टैबिंग नेविगेशन में अक्षम फ़ॉर्म तत्वों को छोड़ दिया गया है।

केवल पढ़ने के लिए विशेषता

  • सभी फॉर्म एलिमेंट्स में आसानी से विशेषता नहीं होती है। सबसे उल्लेखनीय <SELECT>, <OPTION>है, और <BUTTON>तत्वों केवल पढ़ने के लिए जिम्मेदार बताते हैं की जरूरत नहीं है (हालांकि वे दोनों विकलांग गुण)
  • ब्राउज़र कोई डिफ़ॉल्ट ओवरराइड दृश्य प्रतिक्रिया प्रदान नहीं करते हैं कि फॉर्म तत्व केवल पढ़ा जाता है। (यह एक समस्या हो सकती है ... नीचे देखें।)
  • आसानी से सेट किए गए एट्रिब्यूट फॉर्म वाले तत्व फॉर्म प्रोसेसर के पास पहुंच जाएंगे।
  • केवल प्रपत्र तत्व पढ़ें ध्यान प्राप्त कर सकते हैं
  • केवल फार्म तत्वों को टैब्ड नेविगेशन में शामिल किया गया है।

5
आसानी से तत्व पर आप CTRL + C का उपयोग नहीं कर सकते, लेकिन आप सही माउस क्लिक और कॉपी का चयन कर सकते हैं।
रुमप्लिन

7
@Rumplin क्या आप इसके बारे में निश्चित हैं? मैंने अभी-अभी परीक्षण किया था और OS X पर Chrome में कीबोर्ड शॉर्टकट के साथ कॉपी कर पाया था।
evanrmurphy

5
"सभी फॉर्म तत्वों में एक पठनीय विशेषता नहीं होती है। अधिकांश उल्लेखनीय, <SELECT>, <OPTION>, और <BUTTON> तत्वों में आसानी से विशेषता नहीं होती है (हालाँकि आपके दोनों के पास अक्षम विशेषताएँ हैं)"। यही कारण है कि कभी-कभी आपको चुनिंदा रूपों के लिए छिपे हुए इनपुट फ़ील्ड के साथ "अक्षम" विशेषता का उपयोग करना पड़ता है।
डोनाटो

Chrome के वर्तमान संस्करण में पठनीय तत्व फोकस प्राप्त नहीं कर सकते हैं। यह समस्याग्रस्त है यदि आप उपयोगकर्ताओं से उन मानों को स्क्रॉल करने में सक्षम होने की अपेक्षा कर रहे हैं जो इनपुट के आकार से अधिक हैं।
माइक फेल्टमैन

5
तो यह मेरी समझ है कि disabled इसका मतलब है readonly लेकिन readonlyइसका मतलब नहीं है disabled। दूसरे शब्दों में यदि किसी तत्व में disabledविशेषता है तो विशेषता को शामिल करने की भी आवश्यकता नहीं है readonly। सही बात?
छरवे

91

जब कोई तत्व अक्षम विशेषता हो, तो कोई भी घटना शुरू नहीं होती है।

नीचे से कोई भी ट्रिगर नहीं होगा।

$("[disabled]").click( function(){ console.log("clicked") });//No Impact
$("[disabled]").hover( function(){ console.log("hovered") });//No Impact
$("[disabled]").dblclick( function(){ console.log("double clicked") });//No Impact

जबकि आसानी से ट्रिगर किया जाएगा।

$("[readonly]").click( function(){ console.log("clicked") });//log - clicked
$("[readonly]").hover( function(){ console.log("hovered") });//log - hovered
$("[readonly]").dblclick( function(){ console.log("double clicked") });//log - double clicked

35

विकलांग का मतलब है कि फॉर्म सबमिट होने पर उस फॉर्म एलिमेंट का कोई डेटा जमा नहीं किया जाएगा। केवल-पढ़ने का मतलब है कि तत्व के भीतर से कोई भी डेटा सबमिट किया जाएगा, लेकिन इसे उपयोगकर्ता द्वारा नहीं बदला जा सकता है।

उदाहरण के लिए:

<input type="text" name="yourname" value="Bob" readonly="readonly" />

यह तत्व "yourname" के लिए "Bob" मान जमा करेगा।

<input type="text" name="yourname" value="Bob" disabled="disabled" />

यह तत्व "yourname" के लिए कुछ भी प्रस्तुत नहीं करेगा।


6
दोनों readonlyऔर disabledबूलियन मान रहे हैं। के disabledबजाय का उपयोग करें disabled="disabled"(समान रूप से पढ़ने के लिए)
रैप्टर

5
दोनों शब्दार्थ रूप से सही हैं। HTML5 आपको उपयोग करने की अनुमति देता है।
माइकल Irigoyen

3
मूल्यों के बिना, केवल गुण नाम का उपयोग करने के संदर्भ में, बिना किसी सलाह के - क्योंकि तब कोड एक्सएमएल / एक्सएचटीएमएल मान्य नहीं होगा। मुझे पता है कि बहुत सारे देवता उन लोगों की परवाह नहीं करते हैं, लेकिन उन्हें कम से कम नुकसान के बारे में पता होना चाहिए। व्यक्तिगत रूप से मैं एक्सएचटीएमएल अनुपालन के लिए प्रयास करता हूं - जब तक कि एक सम्मोहक कारण नहीं दिया जाता है, जो मुझे अभी तक नहीं मिला है - इसलिए मैं लंबे / डुप्लिकेट रूप का उपयोग करता हूं।
अंडरस्कोर_ड

1
@ToolmakerSteve क्या आपके पास एक विशिष्ट उद्धरण है जो खाली स्ट्रिंग XHTML मान्य है? मैं केवल यह कहकर कमेंटरी पेज पा सकता हूं कि यह HTML5 के लिए वैध है। एक्सएचटीएमएल के बारे में बात करते हुए मैंने देखा है कि बूलियन विशेषताओं के लिए इसका फॉर्म होना चाहिए attrname="attrname"। किसी भी तरह से, यह विशेष रूप से अच्छी तरह से प्रलेखित नहीं लगता है, कम से कम ऐसा नहीं है जो मुझे मिल सकता है। ठीक है, यह वहाँ है - w3.org/TR/html4/intro/sgmltut.html#h-3.3.4.2 - लेकिन इसमें केवल विशेष रूप से SGML और HTML का उल्लेख है, XHTML का नहीं .... बहुत सारे समादेशों का: S
अंडरस्कोर_सेप्ट

1
... लेकिन HTML के लिए बिट पर छोड़ना, जहां उपस्थिति / अनुपस्थिति पर्याप्त है - हम इसे प्राप्त करते हैं, जो संभवतः एक्सएचटीएमएल की चूक से लागू होता है: Boolean attributes may legally take a single value: the name of the attribute itself (e.g., selected="selected").इसलिए खाली स्ट्रिंग मान्य नहीं लगती है।
अंडरस्कोर_ड

4

अन्य उत्तर के रूप में भी (अक्षम सर्वर पर नहीं भेजा जाता है, आसानी से) लेकिन कुछ ब्राउज़र अक्षम रूप को उजागर करने से रोकते हैं, जबकि रीड-ओनली को अभी भी हाइलाइट किया जा सकता है (और कॉपी किया गया है)।

http://www.w3schools.com/tags/att_input_disabled.asp

http://www.w3schools.com/tags/att_input_readonly.asp

केवल पढ़ने के लिए फ़ील्ड को संशोधित नहीं किया जा सकता है। हालांकि, एक उपयोगकर्ता इसे टैब कर सकता है, इसे हाइलाइट कर सकता है, और इससे पाठ कॉपी कर सकता है।


1

यदि किसी फॉर्म को क्लीयर (रीसेट) करने पर एक डिसेबल टेक्स्टबॉक्स की वैल्यू बरकरार रखनी पड़ती है, disabled = "disabled" इसका उपयोग किया जाना चाहिए, क्योंकि केवल-पढ़ने के लिए पाठ बॉक्स मान को बनाए नहीं रखेगा

उदाहरण के लिए:

एचटीएमएल

पाठ बॉक्स

<input type="text" id="disabledText" name="randombox" value="demo" disabled="disabled" />

रीसेट बटन

<button type="reset" id="clearButton">Clear</button>

उपरोक्त उदाहरण में, जब स्पष्ट बटन दबाया जाता है, तो अक्षम पाठ मान को प्रपत्र में बनाए रखा जाएगा। के मामले में मान को बरकरार नहीं रखा जाएगाinput type = "text" readonly="readonly"

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