<इनपुट> में "रीडऑनली" विशेषता कैसे जोड़ें?


301

मैं readonlyएक विशिष्ट में कैसे जोड़ सकता हूं <input>? .attr('readonly')काम नहीं करता।


2
.attr ('readonly', true) काम करता है, अन्य न
Qiao

3
.attr ('readonly', 'readonly') भी काम करता है
Qiao

3
यह निर्भर करता है कि आप किस DOCTYPE का उपयोग करते हैं। HTML के लिए 4.01 DTD का CMS से जवाब काम कर रहा है और HTML 4.01 को मान्य है। यदि आप XHTML DTD का उपयोग करते हैं तो ceejayoz से उत्तर काम कर रहा है और XHTML मान्य है।
bjoernwibben

2
यह doctype पर निर्भर नहीं करता है, DOM एक ही है चाहे वह HTML या XML के माध्यम से पढ़ा गया हो, और किसी भी मामले में XHTML लगभग हमेशा अभी भी IE संगतता के लिए HTML नहीं XML के रूप में परोसा जाता है।
बॉब

जवाबों:


545

jQuery <1.9

$('#inputId').attr('readonly', true);

jQuery 1.9+

$('#inputId').prop('readonly', true);

प्रोप और एटर के बीच अंतर के बारे में और पढ़ें


1
क्या आपको यकीन है? मुझे लगा कि इतना अस्वस्थ है, लेकिन ऐनक के बारे में कुछ नहीं पा सकता है। <input name = "foo" readonly = "readonly" value = "bar" /> validator.w3.org पर पूरी तरह से मान्य है।
जोनास

17
: इस पोस्ट में, के रूप में jQuery एपीआई में कहा गया है बल्कि .attr () की तुलना में .prop करने के लिए बदल किया जाना चाहिए () jquery.com/upgrade-guide/1.9/#attr-versus-prop-
frshca

आसानी से पढ़ी जाने वाली विशेषता "बूलियन विशेषता" है - whatwg.org/specs/web-apps/current-work/#boolean-attribute कुछ भ्रामक नाम के बावजूद, मान "सत्य" या "गलत" नहीं होना चाहिए। जबकि मुझे लगता है कि ऊपर दिया गया कोड वास्तव में काम करेगा (क्रोम में jQuery 1.8.1 के साथ परीक्षण किया गया), यह अनुभवहीन के लिए बाद में भ्रम पैदा कर सकता है। इसके अलावा, jQuery डॉक्स के अनुसार मान संख्या या स्ट्रिंग होना चाहिए, बूलियन नहीं। api.jquery.com/attr/#attr2
ल्यूक

151

$ .Prop () का उपयोग करें

$("#descrip").prop("readonly",true);

$("#descrip").prop("readonly",false);

8
.Prop के लिए jQuery एपीआई पढ़ने के बाद, यह स्वीकृत उत्तर होना चाहिए। मैंने हमेशा .attr ('readonly', 'readonly') और .removeAttr ('readonly') अतीत में किया था, लेकिन यह अधिक सही प्रतीत होता है और कोड को क्लीनर भी बनाता है।
ईवान २ w

4
सभी को इस उत्तर का उपयोग करना चाहिए, जैसा कि यहाँ कहा गया है: jquery.com/upgrad-guide/1.9/#attr-versus-prop-
frshca

4
उपयोग करने के साथ सावधानी का एक शब्द $.prop(): Prop खाली / खाली स्ट्रिंग के लिए आसानी से विशेषता सेट करेगा, इसलिए यदि आपके पास कोई सीएसएस है जो विशेषता चयनकर्ता का उपयोग करता है [readonly="readonly"], तो आपको इसे [readonly](या दोनों को शामिल करना होगा) बदलना होगा ।
ल्यूक

28

Readonly html में परिभाषित एक विशेषता है, इसलिए इसे एक की तरह व्यवहार करें।

आप जिस वस्तु के साथ काम कर रहे हैं यदि आप उसे संपादन योग्य नहीं बनाना चाहते हैं, तो आपको पठनीय = "पठनीय" जैसा कुछ होना चाहिए। और यदि आप चाहते हैं कि यह फिर से संपादन योग्य हो, तो आपके पास रीडोनली = '' जैसा कुछ नहीं होगा (यह मानक नहीं है अगर मैं सही तरीके से समझा हूं)। आपको वास्तव में संपूर्ण के रूप में विशेषता को निकालने की आवश्यकता है।

जैसे, जौरी का उपयोग करते समय इसे जोड़ना और इसे हटाना यह समझ में आता है।

कुछ आसानी से सेट करें:

$("#someId").attr('readonly', 'readonly');

आसानी से निकालें:

$("#someId").removeAttr('readonly');

यह एकमात्र विकल्प था जिसने वास्तव में मेरे लिए काम किया। आशा है ये मदद करेगा!


20

.attr('readonly', 'readonly')चाल चलनी चाहिए। आपका .attr('readonly')केवल मान लौटाता है, यह एक सेट नहीं करता है।


16
jQuery का attr () जावास्क्रिप्ट गुणों पर काम करता है, HTML विशेषताओं पर नहीं, भले ही नाम अन्यथा का अर्थ हो। attr ('readonly') वास्तव में DOM स्तर 1 HTML प्रॉपर्टी पर आसानी से काम कर रहा है, जो एक बूलियन है, इसलिए 'true' अधिक उपयुक्त है। हालांकि, स्ट्रिंग 'आसानी से' भी एक सत्य मूल्य है जब स्वचालित रूप से एक बूलियन में परिवर्तित हो जाता है, इसलिए उपरोक्त अभी भी काम करता है।
बॉब

मुझे नहीं लगता कि आप विशेषता को 'सच' पर सेट करना चाहते हैं। .attrमूल्य केवल एक स्ट्रिंग या संख्या, कोई बूलियन नहीं होना चाहिए, jQuery डॉक्स के अनुसार: api.jquery.com/attr/#attr2 इसके अलावा, एचटीएमएल "बूलियन गुण" केवल रिक्त स्ट्रिंग या विशेषता का मान होना चाहिए। मुझे लगता है कि .prop()भ्रम से बचने के लिए समाधान का उपयोग करना है।
ल्यूक

16

मुझे लगता है कि "अक्षम" इनपुट को POST पर भेजे जाने से बाहर रखता है


4
हाँ यह करता है। इस कारण से मुझे "विकलांग" के लिए एक विकल्प की तलाश करते हुए मुझे यह धागा मिला।
जोनास ने 13

लेकिन आप इसे भेजने से ठीक पहले सक्षम कर सकते हैं, और इसे बाद में $ (दस्तावेज़) .on ('सबमिट', "# फ़ॉर्म", फ़ंक्शन (e) {// इनपुट्स को सही रूप से सक्षम कर सकते हैं; // फिर इसे निष्क्रिय कर दें; आवश्यकता} यह काम करता है मैं इसे परीक्षण किया
Geomorillo

क्या HTML में केवल इनपुट मानों को छिपाए बिना POST पर भेजने की अनुमति है?
अजय ताकुर

12

आप .removeAttr का उपयोग करके आसानी से अक्षम कर सकते हैं;

$('#descrip').removeAttr('readonly');

5

आसानी से सक्षम करने के लिए:

$("#descrip").attr("readonly","true");

आसानी से अक्षम करने के लिए

$("#descrip").attr("readonly","");

से api.jquery.com/attr "jQuery 1.6 के रूप में, .attr () विधि रिटर्न गुण है कि सेट नहीं किया गया है के लिए अपरिभाषित। प्राप्त करने के लिए और, जाँच की तरह के रूप में परिवर्तन डोम प्रॉपर्टी चयनित, या प्रपत्र तत्वों की विकलांग राज्य, .prop () विधि का उपयोग करें। "
डेविड क्लार्क

1
विशेषता को "सही" के स्ट्रिंग पर सेट नहीं किया जाना चाहिए। यह काम कर सकता है, लेकिन तकनीकी रूप से सही नहीं है। (ऊपर मेरी पिछली टिप्पणियाँ देखें।)
ल्यूक

इस सुझाव का उपयोग न करें, यहाँ उपलब्ध बहुत बेहतर हैं। "सही" सेटिंग के लिए सही नहीं है, और निकालना भी गलत है।
MiFiHiBye 19

4

SetAttribute संपत्ति का उपयोग करें। उदाहरण में ध्यान दें कि यदि 1 का चयन टेक्स्टबॉक्स में रीडोनॉली विशेषता को लागू करता है, तो अन्यथा एट्रिब्यूट को आसानी से हटा दें।

http://jsfiddle.net/baqxz7ym/2/

document.getElementById("box1").onchange = function(){
  if(document.getElementById("box1").value == 1) {
    document.getElementById("codigo").setAttribute("readonly", true);
  } else {
    document.getElementById("codigo").removeAttribute("readonly");
  }
};

<input type="text" name="codigo" id="codigo"/>

<select id="box1">
<option value="0" >0</option>
<option value="1" >1</option>
<option value="2" >2</option>
</select>

-4

JQuery के संस्करण के लिए <1.9:

$('#inputId').attr('disabled', true);

JQuery संस्करण के लिए> = 1.9:

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