सीएसएस

Question

से Textarea को अक्षम करने से एक पाठ क्षेत्र (या किसी अन्य इनपुट तत्व) को निष्क्रिय करने के लिए, आप कर सकते हैं:

• HTML में, आप लिख सकते हैं: <textarea id='mytextarea' disabled></textarea>

• jQuery से, आप कर सकते हैं : $("#mytextarea").attr("disabled","disabled");

• सीएसएस? क्या सीएसएस के साथ टेक्स्टरेरा को अक्षम करना संभव है?

Answer 1

आप टेक्स्टरेरा को अक्षम कर सकते हैं, लेकिन आप वास्तव में इसे अक्षम नहीं कर सकते हैं।

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

Answer 2

दुर्भाग्य से शुद्ध सीएसएस में संभव नहीं है ... आपको जावास्क्रिप्ट का उपयोग करना होगा।

Answer 3

नहीं, यह सीएसएस में नहीं किया जा सकता है। लेकिन, आप इनपुट को सीएसएस में "अक्षम" के रूप में शैलीबद्ध कर सकते हैं और एचटीएमएल कोड में संपत्ति maxlength = "0" का उपयोग कर सकते हैं ताकि लोग इसमें लिख सकें। साथ ही, पॉइंटर शैली को सही के रूप में बदलना सुनिश्चित करें ताकि लोग उस सूचक को नहीं देख सकें जो उन्हें बॉक्स में लिखने के लिए कहता है।

Answer 4

सीएसएस शैलियों के साथ सौदों। तत्व को अक्षम करना कार्यात्मक है।

बेशक, सीएसएस संक्रमण की तरह चीजों के साथ अधिक कार्यात्मक हो रहा है और यह एक भूरे रंग का क्षेत्र है। लेकिन सीएसएस का उद्देश्य इसे शैलियों के रूप में रखना है और तत्व कार्यात्मक नियंत्रण को नियंत्रित नहीं करना है।

नहीं, सीएसएस तत्वों को अक्षम नहीं कर सकता है।

आप "नकली" अक्षम रूप से अक्षम दिखने के लिए एक अक्षम नियंत्रण स्टाइल कर सकते हैं।

Answer 5

यहां एक हैक है।

<textArea class="tailLog">This page is waiting for something.</textArea> 

<script type="text/javascript"> 
    $(document).ready( function(){ 
      $(".tailLog").off().on("keydown", function(event){ 
       event.preventDefault(); 
       return; 
      }); 
    }); 
</script> 

यह जिस तरह से काम करता है वह यह है। जब भी उपयोगकर्ता कुछ भी दर्ज करने का प्रयास करता है, हम घटना को पकड़ने के लिए jquery का उपयोग करते हैं। फिर हम उस घटना को बताते हैं जिसे हम नहीं चाहते हैं कि यह अपना डिफ़ॉल्ट व्यवहार करे। जैसा कि मैंने इसे एक हैक कहा है, लेकिन यह एक चुटकी में एक प्रभावी है।

Answer 6

एक प्रोजेक्ट में मेरे पास एक टेक्स्टरी और कंटेनर के साथ एक कंटेनर है। पूरी बात मैं निम्नलिखित कोड के साथ यह करने के लिए एक वर्ग संलग्न अक्षम करने के लिए:

.disabled { 
    opacity: 0.3; 
} 
.disabled:after { 
    width: 100%; 
    height: 100%; 
    position: absolute; 
} 

<div class="disabled"> 
    <textarea></textarea> 
    <!-- textarea, buttons and other input elements --> 
</div> 

जबकि अस्पष्टता केवल दिखाने के लिए है,: के बाद तत्व काम कर रहा है। कंटेनर में सभी तत्व अब क्लिक और माउसओवर पर प्रतिक्रिया नहीं कर रहे हैं (टैबलेटर के साथ उन तक पहुंचने के बावजूद अभी भी काम करेगा)। मेरी जरूरतों के लिए और मेरे मामले में यह ठीक काम करता है और एक आसान सीएसएस हैक है।

Answer 7

<textarea placeholder="This is a textarea, and it is not clickable" style="pointer-events: none"></textarea> 

आप तत्वों पूरी तरह से सीएसएस के साथ उन पर क्लिक कर सकते हैं: point-events: none;

textarea { 
 
    pointer-events: none; 
 
    border: 1px solid #eee; 
 
    padding: 20px; 
 
}

<textarea placeholder="This is a textarea, and it is not clickable"></textarea>