تبلیغات
تبلیغات

قطعه کد تغییر ارتفاع textarea با زیاد شدن متن در جاوا اسکریپت

شاید بخواهید textarea ای در یک سند HTML ایجاد کنید که بتواند بصورت خودکار، با زیاد شدن متن داخلش، تغییر اندازه داده و درازتر شود. در اینجا برای انجام این کار هم روش جاوا اسکریپت خالص و هم روش استفاده از جی‌کوئری آورده شده است. استایل زیر نیز بین دو روش، یکسان است.

روش اول: جاوا اسکریپت خالص

داخل رویداد onkeyup، تابع adjust_textarea فراخوانی شده است که المنت textarea را دریافت می‌کند. سپس مقدار ارتفاع آن را، برابرا با ارتفاع اسکرول عمودی خود قرار می‌دهد.

نکته
در اینجا ممکن است موقع افزایش ارتفاع، یک تیک (لگ) مشاهده شود که زیاد خوش‌آیند نیست. بنابراین روش بعدی پیشنهاد می‌شود.

روش دوم: با جی کوئری

در اینجا نیز همانند قبل، از رویداد keyUp و ارتفاع اسکرول استفاده شده است.

فرق این کد با کد قبل در این است که اینجا، افزایش ارتفاع بصورت نرم رخ می‌دهد؛ تا آن تیک (لگ) که در روش اول دیده می‌شود، از بین برود. البته همین کد را نیز می‌توان با جاوا اسکریپت خالص نوشت که کمی دردسر خواهد داشت.

کانال تلگرام فول کده
تبلیغات

درباره نویسنده

هادی اکبرزاده

[ مدیر فول کده ]

علاقه‌مند به اشتراک‌گذاری اطلاعات در هر زمینه‌ای
برنامه‌نویس فول استک

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

نظرات ثبت شده بدون دیدگاه