HTML <textarea> readonly অ্যাট্রিবিউট

<textarea> readonly অ্যাট্রিবিউট

<textarea> এলিমেন্টের readonly অ্যাট্রিবিউট (বুলিয়ান) ব্যবহার করলে টেক্সট এরিয়াটি রিড-অনلی (read-only) হয়ে যায়। ব্যবহারকারী টেক্সট পরিবর্তন করতে পারবে না, কিন্তু কপি (copy) করতে পারবে। ফর্ম সাবমিশনে এর মান পাঠানো হয় (disabled-এ হয় না)।

সিনট্যাক্স

<textarea readonly>টেক্সট কন্টেন্ট</textarea>

উদাহরণ

<!DOCTYPE html>
<html>
<body>
  <h2>সাক্ষাতকার প্রশ্নাবলী</h2>
  <p>প্রশ্ন ১</p>
  <textarea rows="6" cols="70" placeholder="আপনি কেন এডিটর জব প্রোফাইল চান? (১০০ শব্দ)"></textarea>
  <p>প্রশ্ন ২</p>
  <textarea rows="6" cols="70" placeholder="আপনার কি আগে পাবলিশিং অভিজ্ঞতা আছে? (১০০ শব্দ)"></textarea>
  <p>সাক্ষাতকারের নির্দেশনা:</p>
  <textarea rows="6" cols="70" readonly>
    সাক্ষাতকারদাতার ১০টা পর্যন্ত সার্টিফিকেট সহ উপস্থিত হতে হবে।
  </textarea>
</body>
</html>

আউটপুট

ব্যাখ্যা

৩টি টেক্সট এরিয়া — শেষটি readonly:

<textarea rows="6" cols="70" readonly>
  সাক্ষাতকারদাতার ১০টা পর্যন্ত সার্টিফিকেট সহ উপস্থিত হতে হবে।
</textarea>

ব্যবহারকারী এই টেক্সটটি পড়তে ও কপি করতে পারবে, কিন্তু পরিবর্তন করতে পারবে না।

JavaScript-এ কন্ট্রোল

const textarea = document.querySelector('textarea[readonly]');
// রানটাইমে readonly টগল
textarea.readOnly = false; // এডিটেবল
textarea.readOnly = true;  // রিড-অনلی

// চেক করা
if (textarea.readOnly) { ... }

CSS স্টাইলিং

textarea[readonly] {
  background-color: #f5f5f5;
  cursor: not-allowed;
  border-color: #ddd;
}