خاصیت contenteditable در HTML

  /  فرانت اند   /  HTML   /  خاصیت contenteditable در HTML

خاصیت contenteditable در HTML مشخص می کند که آیا محتوای متنی درون یک عنصر قابل ویرایش هست یا خیر.

مثال

در مثال زیر ما خاصیت contenteditable برابر با true قرار داده ایم که در نتیجه می توانید محتوای متنی درون عنصر <p> را با کلیک برروی آن ویرایش کنید.

<p contenteditable="true">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است</p>


تعریف و کاربرد

خاصیت contenteditable در HTML مشخص می کند که محتوای درون یک عنصر قابل ویرایش هست یا نه.

نکته: اگر صفت contenteditable روی عنصری تنظیم نشده باشد این خاصیت را از عناصر پدر به ارث می برد.

یعنی مثال ساده زیر را در نظر بگیرید:

<div contenteditable="true">
<p >لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است</p>
</div>

با اینکه صفت contenteditable روی تگ div تنظیم شده ولی عناصر والد یا فرزند خود را تحت تأثیر قرار می دهد و به نوعی این خاصیت روی آنها فعال می شود و در مثال بالا شما می توانید محتوای متنی درون تگ <p> را که فرزند تگ <div> هست تغییر بدید.

پشتیبانی مرورگر ها

اعداد موجود در جدول اولین نسخه مرورگر را که ویژگی را کاملاً پشتیبانی می کند مشخص می کند.

خاصیت
contenteditable4.06.03.53.110.1

نحوه استفاده

<element contenteditable="true|false">

مقادیر خاصیت

مقدارتوضیحات
trueمشخص می کند که عنصر قابل ویرایش است
falseمشخص می کند که عنصر قابل ویرایش نیست
5/5 - (1 امتیاز)

برای دسترسی به آموزش های بیشتر و ویدیو های من ، کلمه کلیدی متین برونسی را داخل گوگل سرچ کنید.

ارسال یک نظر