কিভাবে জাভাস্ক্রিপ্টে টেক্সট এরিয়া ভ্যালু পাবেন?

Kibhabe Jabhaskripte Teksata Eriya Bhyalu Pabena



প্রতিক্রিয়াশীল ওয়েব পৃষ্ঠা বা সাইট ডিজাইন করার প্রক্রিয়ায়, সঠিক প্রবেশ করা ডেটা নিশ্চিত করার জন্য প্রবেশ করা ডেটার ব্যবহারকারীকে প্রম্পট করতে হবে। উদাহরণস্বরূপ, টাইপ করা মেল এবং পাসওয়ার্ড নিশ্চিত করা। অন্য ক্ষেত্রে, একটি নির্বাচিত বিকল্পের উপর একটি ত্রুটি বা সতর্কীকরণ লগিং করা যা কিছু গুরুতর পরিণতির দিকে নিয়ে যেতে পারে যেমন ভাইরাস ইত্যাদি। এই ধরনের পরিস্থিতিতে, জাভাস্ক্রিপ্টে পাঠ্য এলাকার মান পাওয়া ডেটা গোপনীয়তা বজায় রাখতে খুব সহায়ক।

এই লেখাটি জাভাস্ক্রিপ্টে টেক্সট এরিয়ার মান পেতে পন্থা ব্যাখ্যা করবে।

কিভাবে জাভাস্ক্রিপ্টে টেক্সট এরিয়া ভ্যালু পাবেন?

নিম্নলিখিত পদ্ধতিগুলি ব্যবহার করে জাভাস্ক্রিপ্টে পাঠ্য এলাকার মান আনা যেতে পারে:







  • ' getElementById() 'পদ্ধতি।
  • ' AddEventListener() 'পদ্ধতি।
  • ' jQuery

পদ্ধতি 1: getElementById() পদ্ধতি ব্যবহার করে জাভাস্ক্রিপ্টে টেক্সট এরিয়া ভ্যালু পান

দ্য ' getElementById() ' পদ্ধতি নির্দিষ্ট ' সহ একটি উপাদান অ্যাক্সেস করে আইডি ইনপুট টেক্সট ফিল্ড আনতে এবং এতে প্রবেশ করা মান ফেরত দিতে এই পদ্ধতিটি প্রয়োগ করা যেতে পারে।



বাক্য গঠন



নথি getElementById ( উপাদান )

প্রদত্ত সিনট্যাক্সে:





  • ' উপাদান ' কোনো কিছু নির্দেশ করে ' আইডি ” নির্দিষ্ট উপাদানের বিপরীতে আনা হবে।

উদাহরণ
আসুন নিম্নলিখিত উদাহরণটি দেখুন:

আসুন নীচের কোডে নিম্নলিখিত পদক্ষেপগুলি প্রয়োগ করি:



< h3 > পাঠ্য এলাকার মান পান ভিতরে জাভাস্ক্রিপ্ট h3 >
কিছু লেখো : < ইনপুট টাইপ = 'পাঠ্য' আইডি = 'txt' স্থানধারক = 'লেখা অন্তর্ভুক্ত করুন...' >
< বোতামে ক্লিক করুন = 'textareaValue()' > মান পান বোতাম >

নিম্নলিখিত পদক্ষেপগুলি সম্পাদন করুন:

  • প্রথম ধাপে, বিবৃত শিরোনাম উল্লেখ করুন।
  • এর পরে, নির্দিষ্ট 'সহ ইনপুট পাঠ্য ক্ষেত্র অন্তর্ভুক্ত করুন আইডি ' এবং ' স্থানধারক 'মান।
  • এছাড়াও, সংযুক্ত একটি বোতাম তৈরি করুন ' অনক্লিক ” ইভেন্ট ফাংশনে পুনঃনির্দেশ করা হচ্ছে textareaValue()

কোডের জাভাস্ক্রিপ্ট অংশে এগিয়ে যাওয়া যাক:

< লিপি >
ফাংশন textareaValue ( ) {
দিন পাওয়া = নথি getElementById ( 'txt' ) . মান
সতর্ক ( পাওয়া )
}
লিপি >

উপরের জাভাস্ক্রিপ্ট কোডে:

  • 'নামক একটি ফাংশন ঘোষণা করুন textareaValue()
  • এর সংজ্ঞায়, '' ব্যবহার করে তার নির্দিষ্ট আইডি দ্বারা ইনপুট পাঠ্য ক্ষেত্রে অ্যাক্সেস করুন getElementById() 'পদ্ধতি।
  • এছাড়াও, প্রয়োগ করুন ' মান প্রবেশ করা টেক্সট মান পুনরুদ্ধার করার জন্য সম্পত্তি।
  • অবশেষে, 'এর মাধ্যমে পাঠ্য এলাকার মান প্রদর্শন করুন সতর্ক 'সংলাপ বক্স।

আউটপুট

উপরের আউটপুটে, এটি লক্ষ্য করা যায় যে প্রবেশ করা মানটি সতর্ক সংলাপ বাক্সের মাধ্যমে আনা হয়েছে।

পদ্ধতি 2: addEventListener() পদ্ধতি ব্যবহার করে জাভাস্ক্রিপ্টে টেক্সট এরিয়া ভ্যালু পান

দ্য ' AddEventListener() 'পদ্ধতি একটি সংযুক্ত করতে ব্যবহৃত হয়' ঘটনা একটি উপাদান সহ। এই পদ্ধতিটি ফাংশনের সাথে একটি ইভেন্ট সংযুক্ত করার জন্য ব্যবহার করা যেতে পারে যাতে কনসোলে প্রতিটি ইনপুটের পাশাপাশি টেক্সট এরিয়ার মান আনা হয়।

বাক্য গঠন

উপাদান AddEventListener ( ঘটনা , ফাংশন , exec )

উপরের সিনট্যাক্সে:

  • ' ঘটনা ” ইভেন্টের নাম নির্দেশ করে।
  • ' ফাংশন ” একটি ইভেন্টের ট্রিগারের উপর চালানোর জন্য ফাংশন নির্দেশ করে।
  • ' exec ” হল ঐচ্ছিক পরামিতি।

উদাহরণ
আসুন ধাপে ধাপে নীচের উদাহরণটি অনুসরণ করি:

< লেবেল জন্য = 'txt' > কিছু লেখো : লেবেল < br < br >
< textarea id = 'txtarea' সারি = '5' কলস = '25' স্থানধারক = ' লেখা অন্তর্ভুক্ত করুন...' >> textarea >
< স্ক্রিপ্ট প্রকার = 'টেক্সট/জাভাস্ক্রিপ্ট' >
দিন পাওয়া = নথি getElementById ( 'txtarea' ) ;
কনসোল লগ ( পাওয়া . মান ) ;
পাওয়া . AddEventListener ( 'ইনপুট' , ফাংশন textareaValue ( ঘটনা ) {
কনসোল লগ ( ঘটনা লক্ষ্য . মান ) ;
} ) ;
লিপি >

উপরের কোড-স্নিপেটে:

  • উল্লেখিত লেবেল উল্লেখ করুন। এছাড়াও, বরাদ্দ করুন ' textarea '' এর নির্দিষ্ট মান সহ উপাদান আইডি ' এবং ' স্থানধারক ” এবং এর মাত্রাও সামঞ্জস্য করুন।
  • কোডের জাভাস্ক্রিপ্ট অংশে, পূর্ববর্তী ধাপে নির্দিষ্ট টেক্সটেরিয়া অ্যাক্সেস করুন এবং এটি ব্যবহার করে প্রদর্শন করুন “ মান 'সম্পত্তি।
  • পরবর্তী ধাপে, একটি ইভেন্ট সংযুক্ত করুন ' পাঠ্য 'আনানো' পাঠ্য এলাকা ' ব্যবহার করে ' AddEventListener() 'পদ্ধতি এবং এটি ফাংশনে প্রয়োগ করুন' textareaValue() ” দ্য ' ঘটনা ” এর যুক্তিতে ঘটনাটি সম্পর্কে তথ্য দেয় যা ট্রিগার হয়।
  • এর ফলে প্রবেশ করা প্রতিটি পাঠ্য মান পাশাপাশি লগ করা হবে।

আউটপুট

উপরের আউটপুট থেকে, ' আনয়ন ” প্রবেশ করা প্রতিটি পাঠ্যের মান পর্যবেক্ষণ করা যেতে পারে।

পদ্ধতি 3: jQuery ব্যবহার করে জাভাস্ক্রিপ্টে টেক্সট এরিয়া ভ্যালু পান

' jQuery ইনপুট টেক্সট ফিল্ড অ্যাক্সেস করতে এবং ডকুমেন্ট অবজেক্ট মডেল(DOM) লোড হওয়ার সাথে সাথে এর কার্যকারিতা ট্রিগার করতে প্রয়োগ করা যেতে পারে।

উদাহরণ
আসুন নীচের উদাহরণটি অনুসরণ করি:

< স্ক্রিপ্ট src = 'https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js' >> লিপি >
কিছু লেখো : < ইনপুট টাইপ = 'পাঠ্য' আইডি = 'txt' স্থানধারক = 'লেখা অন্তর্ভুক্ত করুন...' >
< বোতাম > মান পান বোতাম >

কোডের উপরের লাইনগুলিতে, নিম্নলিখিত পদক্ষেপগুলি সম্পাদন করুন:

  • এর পদ্ধতিগুলি প্রয়োগ করার জন্য jQuery লাইব্রেরি অন্তর্ভুক্ত করুন।
  • উল্লেখ ' ইনপুট ' এর নির্দিষ্ট মান সহ পাঠ্য ক্ষেত্র হিসাবে ' আইডি ' এবং ' স্থানধারক 'আগে আলোচনা করা হয়েছে।
  • এছাড়াও, বোতাম ক্লিকের মান পেতে একটি বোতাম তৈরি করুন।

কোডের জাভাস্ক্রিপ্ট অংশে যান:

< লিপি >
$ ( নথি ) . প্রস্তুত ( ফাংশন ( ) {
$ ( 'বোতাম' ) . ক্লিক ( ফাংশন ( ) {
কনসোল লগ ( $ ( 'ইনপুট:টেক্সট' ) . ভাল ( ) ) ;
} ) ;
} ) ;
লিপি >

বর্ণিত পদক্ষেপগুলি অনুসরণ করুন:

  • প্রয়োগ করুন ' প্রস্তুত() লোড করা DOM-এ আরও পদ্ধতি প্রয়োগ করার জন্য পদ্ধতি।
  • তৈরি বোতাম অ্যাক্সেস করুন এবং সংযুক্ত করুন ' ক্লিক() এটির পদ্ধতি যা তার প্যারামিটারে বর্ণিত ফাংশনটি কার্যকর করবে।
  • ক্লিক() পদ্ধতিটি নির্দিষ্ট ইনপুট টেক্সট ফিল্ড অ্যাক্সেস করবে এবং কনসোলে প্রবেশ করা টেক্সট মান লগ করবে।

আউটপুট

সুতরাং, টাইপের মান কনসোলে লগ করা হয়েছে।

এগুলো জাভাস্ক্রিপ্টের সাহায্যে টেক্সট এরিয়ার মান পাওয়ার বিভিন্ন উপায় ছিল।

উপসংহার

দ্য ' getElementById() 'পদ্ধতি, ' AddEventListener() 'পদ্ধতি বা ' jQuery ” জাভাস্ক্রিপ্টে টেক্সট এরিয়ার মান পেতে ব্যবহার করা যেতে পারে। getElementById() পদ্ধতিটি ইনপুট টেক্সট ফিল্ড অ্যাক্সেস করতে এবং অ্যালার্টের মাধ্যমে প্রবেশ করা টেক্সট এরিয়ার মান প্রদর্শন করতে প্রয়োগ করা যেতে পারে। addEventListener() পদ্ধতি একটি সংযুক্ত করতে ব্যবহার করা যেতে পারে ইনপুট ” ইভেন্ট যা প্রতিটি ইনপুটে পাশাপাশি পাঠ্যের মান পাবে। jQuery সরাসরি বোতামটি অ্যাক্সেস করার জন্য প্রয়োগ করা যেতে পারে এবং কনসোলে বোতামে ক্লিক করলে প্রবেশ করা পাঠ্য মান পুনরুদ্ধার করা যেতে পারে। এই টিউটোরিয়ালটি ব্যাখ্যা করে কিভাবে জাভাস্ক্রিপ্টে টেক্সট এরিয়ার মান পেতে হয়।