جاوا اسکرپٹ میں ٹیکسٹ ایریا ویلیو کیسے حاصل کریں؟

Jawa Askrp My Yks Ayrya Wylyw Kys Hasl Kry



جوابی ویب صفحات یا سائٹس کو ڈیزائن کرنے کے عمل میں، درج کردہ ڈیٹا کے صارف کو فوری طور پر درج کرنے کی ضرورت ہے تاکہ درست درج کردہ ڈیٹا کو یقینی بنایا جا سکے۔ مثال کے طور پر، ٹائپ شدہ میلز اور پاس ورڈز کی تصدیق کرنا۔ دوسری صورت میں، کسی منتخب کردہ آپشن پر کسی غلطی یا وارننگ کو لاگ کرنا جو کچھ سنگین نتائج کا باعث بن سکتا ہے جیسے کہ وائرس وغیرہ۔ ایسے حالات میں جاوا اسکرپٹ میں ٹیکسٹ ایریا ویلیو حاصل کرنا ڈیٹا کی رازداری کو برقرار رکھنے میں بہت مددگار ہے۔

یہ تحریر جاوا اسکرپٹ میں ٹیکسٹ ایریا ویلیو حاصل کرنے کے طریقوں کی وضاحت کرے گی۔

جاوا اسکرپٹ میں ٹیکسٹ ایریا ویلیو کیسے حاصل کریں؟

ٹیکسٹ ایریا ویلیو کو جاوا اسکرپٹ میں درج ذیل طریقوں سے حاصل کیا جا سکتا ہے:







  • ' getElementById() 'طریقہ.
  • ' AddEventListener() 'طریقہ.
  • ' jQuery '

طریقہ 1: getElementById() طریقہ استعمال کرکے جاوا اسکرپٹ میں ٹیکسٹ ایریا ویلیو حاصل کریں

' getElementById() 'طریقہ مخصوص کے ساتھ ایک عنصر تک رسائی حاصل کرتا ہے' آئی ڈی یہ طریقہ ان پٹ ٹیکسٹ فیلڈ کو حاصل کرنے اور اس میں درج قیمت کو واپس کرنے کے لیے لاگو کیا جا سکتا ہے۔



نحو



دستاویز getElementById ( عنصر )

دیئے گئے نحو میں:





  • ' عنصر 'سے مراد ہے' آئی ڈی ” خاص عنصر کے خلاف لایا جائے۔

مثال
آئیے درج ذیل مثال پر ایک نظر ڈالیں:

آئیے درج ذیل کوڈ میں درج ذیل اقدامات کو لاگو کریں:



< h3 > ٹیکسٹ ایریا ویلیو حاصل کریں۔ میں جاوا اسکرپٹ h3 >
کچھ ٹائپ کریں۔ : < ان پٹ کی قسم = 'متن' آئی ڈی = 'TXT' پلیس ہولڈر = 'متن درج کریں...' >
< بٹن پر کلک کریں۔ = 'textareaValue()' > قدر حاصل کریں۔ بٹن >

درج ذیل اقدامات پر عمل کریں:

  • پہلے مرحلے میں، بیان کردہ عنوان کی وضاحت کریں۔
  • اس کے بعد، مخصوص 'کے ساتھ ان پٹ ٹیکسٹ فیلڈ شامل کریں۔ آئی ڈی 'اور' پلیس ہولڈر ' قدر.
  • اس کے علاوہ، منسلک کے ساتھ ایک بٹن بنائیں ' کلک پر تقریب کی طرف ری ڈائریکٹ ہو رہا ہے فنکشن textareaValue()

آئیے کوڈ کے جاوا اسکرپٹ حصے کی طرف بڑھتے ہیں:

< سکرپٹ >
فنکشن textareaValue ( ) {
دو حاصل کریں = دستاویز getElementById ( 'TXT' ) . قدر
الرٹ ( حاصل کریں )
}
سکرپٹ >

اوپر جاوا اسکرپٹ کوڈ میں:

  • ایک فنکشن کا اعلان کریں جس کا نام ' textareaValue() '
  • اس کی تعریف میں، ان پٹ ٹیکسٹ فیلڈ تک اس کی مخصوص آئی ڈی کے ذریعے رسائی حاصل کریں ' getElementById() 'طریقہ.
  • اس کے علاوہ، لاگو کریں ' قدر درج کردہ ٹیکسٹ ویلیو کو بازیافت کرنے کے لیے پراپرٹی۔
  • آخر میں، ٹیکسٹ ایریا ویلیو کو ' کے ذریعے دکھائیں الرٹ ڈائیلاگ باکس۔

آؤٹ پٹ

مندرجہ بالا آؤٹ پٹ میں، یہ دیکھا جا سکتا ہے کہ درج کردہ قدر کو الرٹ ڈائیلاگ باکس کے ذریعے حاصل کیا گیا ہے۔

نقطہ نظر 2: addEventListener() طریقہ استعمال کرتے ہوئے جاوا اسکرپٹ میں ٹیکسٹ ایریا ویلیو حاصل کریں

' AddEventListener() 'طریقہ کو منسلک کرنے کے لئے استعمال کیا جاتا ہے' تقریب 'ایک عنصر کے ساتھ۔ اس طریقہ کو فنکشن کے ساتھ کسی ایونٹ کو منسلک کرنے کے لیے استعمال کیا جا سکتا ہے جیسے کہ کنسول پر ہر ان پٹ کے ساتھ ساتھ ٹیکسٹ ایریا ویلیو حاصل کی جائے۔

نحو

عنصر EventListener شامل کریں۔ ( تقریب , فنکشن , exec )

مندرجہ بالا نحو میں:

  • ' تقریب ' ایونٹ کے نام کی طرف اشارہ کرتا ہے۔
  • ' فنکشن ' کسی تقریب کے محرک پر چلنے والے فنکشن کی نشاندہی کرتا ہے۔
  • ' exec اختیاری پیرامیٹر ہے۔

مثال
آئیے ذیل میں دی گئی مثال کی مرحلہ وار پیروی کریں:

< لیبل کے لیے = 'TXT' > کچھ ٹائپ کریں۔ : لیبل >< بی آر >< بی آر >
< ٹیکسٹیریا آئی ڈی = 'txtarea' قطاریں = '5' کالز = '25' پلیس ہولڈر = 'متن درج کریں...' >> ٹیکسٹیریا >
< سکرپٹ کی قسم = 'متن/جاوا اسکرپٹ' >
دو حاصل کریں = دستاویز getElementById ( 'txtarea' ) ;
تسلی. لاگ ( حاصل کریں . قدر ) ;
حاصل کریں . EventListener شامل کریں۔ ( 'ان پٹ' , فنکشن textareaValue ( تقریب ) {
تسلی. لاگ ( تقریب. ہدف . قدر ) ;
} ) ;
سکرپٹ >

مندرجہ بالا کوڈ کے ٹکڑوں میں:

  • بیان کردہ لیبل کی وضاحت کریں۔ اس کے علاوہ، مختص کریں ' ٹیکسٹیریا ' عنصر ' کی مخصوص قیمت کے ساتھ آئی ڈی 'اور' پلیس ہولڈر اور اس کے طول و عرض کو بھی ایڈجسٹ کریں۔
  • کوڈ کے جاوا اسکرپٹ حصے میں، پچھلے مرحلے میں مخصوص ٹیکسٹیریا تک رسائی حاصل کریں اور اسے استعمال کرتے ہوئے ڈسپلے کریں۔ قدر ' جائیداد.
  • اگلے مرحلے میں، ایک واقعہ منسلک کریں ' متن 'لائے جانے والے کو' متن کا علاقہ ' کا استعمال کرتے ہوئے ' AddEventListener() 'طریقہ اور اسے فنکشن پر لاگو کریں' textareaValue() ' ' تقریب ' اس کی دلیل میں اس واقعہ کے بارے میں معلومات کو منتقل کیا گیا ہے جو متحرک ہوا ہے۔
  • اس کے نتیجے میں ہر درج کردہ متن کی قدروں کو ساتھ ساتھ لاگ ان کیا جائے گا۔

آؤٹ پٹ

مندرجہ بالا آؤٹ پٹ سے، ' لانا درج کردہ ٹیکسٹ ویلیو میں سے ہر ایک کا مشاہدہ کیا جا سکتا ہے۔

طریقہ 3: jQuery کا استعمال کرتے ہوئے جاوا اسکرپٹ میں ٹیکسٹ ایریا ویلیو حاصل کریں۔

' jQuery ” کا اطلاق ان پٹ ٹیکسٹ فیلڈ تک رسائی کے لیے کیا جا سکتا ہے اور دستاویز آبجیکٹ ماڈل (DOM) کے لوڈ ہوتے ہی اس کی فعالیت کو متحرک کیا جا سکتا ہے۔

مثال
آئیے ذیل میں دی گئی مثال کی پیروی کریں:

< سکرپٹ src = 'https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js' >> سکرپٹ >
کچھ ٹائپ کریں۔ : < ان پٹ کی قسم = 'متن' آئی ڈی = 'TXT' پلیس ہولڈر = 'متن درج کریں...' >
< بٹن > قدر حاصل کریں۔ بٹن >

کوڈ کی مندرجہ بالا لائنوں میں، درج ذیل اقدامات کریں:

  • اس کے طریقوں کو لاگو کرنے کے لیے jQuery لائبریری کو شامل کریں۔
  • وضاحت کریں ' ان پٹ 'کی مخصوص اقدار کے ساتھ ٹیکسٹ فیلڈ کے طور پر' آئی ڈی 'اور' پلیس ہولڈر 'جیسا کہ پہلے بحث کی گئی ہے۔
  • اس کے علاوہ، بٹن پر کلک کرنے پر قدر حاصل کرنے کے لیے ایک بٹن بنائیں۔

کوڈ کے جاوا اسکرپٹ حصے پر جائیں:

< سکرپٹ >
$ ( دستاویز ) . تیار ( فنکشن ( ) {
$ ( 'بٹن' ) . کلک کریں ( فنکشن ( ) {
تسلی. لاگ ( $ ( 'ان پٹ: متن' ) . val ( ) ) ;
} ) ;
} ) ;
سکرپٹ >

بیان کردہ مراحل پر عمل کریں:

  • لاگو کریں ' تیار() بھری ہوئی DOM پر مزید طریقوں کو لاگو کرنے کے لیے طریقہ۔
  • تخلیق کردہ بٹن تک رسائی حاصل کریں اور منسلک کریں ' کلک کریں() اس کا طریقہ جو اس کے پیرامیٹر میں بیان کردہ فنکشن کو انجام دے گا۔
  • کلک () طریقہ مخصوص ان پٹ ٹیکسٹ فیلڈ تک رسائی حاصل کرے گا اور کنسول پر درج ٹیکسٹ ویلیو کو لاگ کرے گا۔

آؤٹ پٹ

لہذا، قسم کی قدر کنسول پر لاگ ان ہوتی ہے۔

یہ جاوا اسکرپٹ کی مدد سے ٹیکسٹ ایریا کی ویلیو حاصل کرنے کے تمام مختلف طریقے تھے۔

نتیجہ

' getElementById() 'طریقہ،' AddEventListener() 'طریقہ یا' jQuery جاوا اسکرپٹ میں ٹیکسٹ ایریا ویلیو حاصل کرنے کے لیے استعمال کیا جا سکتا ہے۔ getElementById() طریقہ ان پٹ ٹیکسٹ فیلڈ تک رسائی اور الرٹ کے ذریعے درج ٹیکسٹ ایریا ویلیو کو ظاہر کرنے کے لیے لاگو کیا جا سکتا ہے۔ addEventListener() کا طریقہ استعمال کیا جا سکتا ہے ان پٹ ” ایونٹ جو ہر ان پٹ پر ساتھ ساتھ ٹیکسٹ ویلیو حاصل کرے گا۔ jQuery کو بٹن تک براہ راست رسائی حاصل کرنے کے لیے لاگو کیا جا سکتا ہے اور کنسول پر بٹن پر کلک کرنے پر درج ٹیکسٹ ویلیو کو بازیافت کیا جا سکتا ہے۔ یہ ٹیوٹوریل بتاتا ہے کہ جاوا اسکرپٹ میں ٹیکسٹ ایریا ویلیو کیسے حاصل کی جائے۔