ஜாவாஸ்கிரிப்ட்டில் உரை பகுதி மதிப்பைப் பெறுவதற்கான அணுகுமுறைகளை இந்த எழுதுதல் விளக்குகிறது.
ஜாவாஸ்கிரிப்ட்டில் உரைப் பகுதி மதிப்பைப் பெறுவது எப்படி?
பின்வரும் அணுகுமுறைகளைப் பயன்படுத்தி உரை பகுதி மதிப்பை ஜாவாஸ்கிரிப்ட்டில் பெறலாம்:
- ' getElementById() ”முறை.
- ' addEventListener() ”முறை.
- ' jQuery ”.
அணுகுமுறை 1: getElementById() முறையைப் பயன்படுத்தி JavaScript இல் உரைப் பகுதி மதிப்பைப் பெறவும்
' getElementById() 'முறை குறிப்பிடப்பட்ட' ஒரு உறுப்பை அணுகுகிறது ஐடி ”.உள்ளீட்டு உரை புலத்தைப் பெறவும், அதில் உள்ளிடப்பட்ட மதிப்பை வழங்கவும் இந்த முறையைச் செயல்படுத்தலாம்.
தொடரியல்
ஆவணம். getElementById ( உறுப்பு )
கொடுக்கப்பட்ட தொடரியல்:
- ' உறுப்பு ” என்பது “ ஐடி 'குறிப்பிட்ட உறுப்புக்கு எதிராகப் பெற வேண்டும்.
உதாரணமாக
பின்வரும் எடுத்துக்காட்டைப் பார்ப்போம்:
கீழே உள்ள குறியீட்டில் பின்வரும் படிகளைப் பயன்படுத்துவோம்:
< h3 > உரை பகுதி மதிப்பைப் பெறுங்கள் உள்ளே ஜாவாஸ்கிரிப்ட் h3 >
ஏதாவது தட்டச்சு செய்யவும் : < உள்ளீடு வகை = 'உரை' ஐடி = 'txt' இடப்பெயர்ச்சி = 'உரையை உள்ளிடவும்...' >
< பொத்தானை கிளிக் செய்யவும் = 'textareaValue()' > மதிப்பைப் பெறுங்கள் பொத்தானை >
பின்வரும் படிகளைச் செய்யவும்:
- முதல் கட்டத்தில், கூறப்பட்ட தலைப்பைக் குறிப்பிடவும்.
- அதன் பிறகு, குறிப்பிட்ட 'உடன் உள்ளீடு உரை புலத்தை சேர்க்கவும் ஐடி 'மற்றும்' இடப்பெயர்ச்சி ' மதிப்பு.
- மேலும், இணைக்கப்பட்ட '' உடன் ஒரு பொத்தானை உருவாக்கவும் கிளிக் செய்யவும் ” நிகழ்வு textareaValue() செயல்பாட்டிற்கு திருப்பி விடப்படுகிறது
குறியீட்டின் ஜாவாஸ்கிரிப்ட் பகுதிக்கு செல்லலாம்:
< கையால் எழுதப்பட்ட தாள் >செயல்பாடு உரைப்பகுதி மதிப்பு ( ) {
அனுமதிக்க பெறு = ஆவணம். getElementById ( 'txt' ) . மதிப்பு
எச்சரிக்கை ( பெறு )
}
கையால் எழுதப்பட்ட தாள் >
மேலே உள்ள ஜாவாஸ்கிரிப்ட் குறியீட்டில்:
- ' என்ற பெயரில் ஒரு செயல்பாட்டை அறிவிக்கவும் textareaValue() ”.
- அதன் வரையறையில், உள்ளீடு உரை புலத்தை அதன் குறிப்பிட்ட ஐடி மூலம் அணுகவும் ' getElementById() ”முறை.
- மேலும், விண்ணப்பிக்கவும் ' மதிப்பு 'உள்ளடக்கப்பட்ட உரை மதிப்பை மீட்டெடுப்பதற்காக சொத்து.
- இறுதியாக, '' வழியாக உரை பகுதி மதிப்பைக் காண்பி எச்சரிக்கை ” உரையாடல் பெட்டி.
வெளியீடு
மேலே உள்ள வெளியீட்டில், உள்ளிடப்பட்ட மதிப்பு எச்சரிக்கை உரையாடல் பெட்டி மூலம் பெறப்படுவதைக் காணலாம்.
அணுகுமுறை 2: addEventListener() முறையைப் பயன்படுத்தி ஜாவாஸ்கிரிப்ட்டில் உரைப் பகுதி மதிப்பைப் பெறவும்
' addEventListener() 'முறையை இணைக்கப் பயன்படுகிறது' நிகழ்வு ” ஒரு உறுப்புடன். கன்சோலில் உள்ள ஒவ்வொரு உள்ளீட்டிலும் டெக்ஸ்ட் ஏரியா மதிப்பு பெறப்படும் வகையில் செயல்பாட்டுடன் நிகழ்வை இணைக்க இந்த முறையைப் பயன்படுத்தலாம்.
தொடரியல்
உறுப்பு. addEventListener ( நிகழ்வு , செயல்பாடு , exec )மேலே உள்ள தொடரியல்:
- ' நிகழ்வு ” நிகழ்வின் பெயரை சுட்டிக்காட்டுகிறது.
- ' செயல்பாடு ” என்பது ஒரு நிகழ்வின் தூண்டுதலின் மீது இயங்கும் செயல்பாட்டைக் குறிக்கிறது.
- ' exec ” என்பது விருப்ப அளவுரு.
உதாரணமாக
கீழே கொடுக்கப்பட்டுள்ள உதாரணத்தை படிப்படியாகப் பின்பற்றுவோம்:
< உரைப்பகுதி ஐடி = 'txtarea' வரிசைகள் = '5' cols = '25' இடப்பெயர்ச்சி = 'உரையை உள்ளிடவும்...' > உரைப்பகுதி >
< ஸ்கிரிப்ட் வகை = 'உரை/ஜாவாஸ்கிரிப்ட்' >
அனுமதிக்க பெறு = ஆவணம். getElementById ( 'txtarea' ) ;
பணியகம். பதிவு ( பெறு . மதிப்பு ) ;
பெறு . addEventListener ( 'உள்ளீடு' , செயல்பாடு உரைப்பகுதி மதிப்பு ( நிகழ்வு ) {
பணியகம். பதிவு ( நிகழ்வு. இலக்கு . மதிப்பு ) ;
} ) ;
கையால் எழுதப்பட்ட தாள் >
மேலே உள்ள குறியீடு துணுக்கில்:
- குறிப்பிடப்பட்ட லேபிளைக் குறிப்பிடவும். மேலும், ஒதுக்குங்கள் ' உரைப்பகுதி 'குறிப்பிட்ட மதிப்பு கொண்ட உறுப்பு' ஐடி 'மற்றும்' இடப்பெயர்ச்சி ” மற்றும் அதன் பரிமாணங்களையும் சரிசெய்யவும்.
- குறியீட்டின் ஜாவாஸ்கிரிப்ட் பகுதியில், முந்தைய படியில் குறிப்பிட்ட உரைப் பகுதியை அணுகி, ' மதிப்பு ”சொத்து.
- அடுத்த கட்டத்தில், ஒரு நிகழ்வை இணைக்கவும் ' உரை 'எடுத்ததற்கு' உரை பகுதி ' பயன்படுத்தி ' addEventListener() 'முறை மற்றும் அதை செயல்பாட்டில் பயன்படுத்தவும்' textareaValue() ”. ' நிகழ்வு ” அதன் வாதத்தில் தூண்டப்பட்ட நிகழ்வு பற்றிய தகவல்களை அனுப்புகிறது.
- இது உள்ளிடப்பட்ட ஒவ்வொரு உரை மதிப்புகளையும் அருகருகே பதிவு செய்யும்.
வெளியீடு
மேலே உள்ள வெளியீட்டில் இருந்து, ' பெறுதல் ” உள்ளிட்ட ஒவ்வொரு உரை மதிப்புகளையும் காணலாம்.
அணுகுமுறை 3: jQuery ஐப் பயன்படுத்தி JavaScript இல் உரை பகுதி மதிப்பைப் பெறவும்
' jQuery ” உள்ளீட்டு உரைப் புலத்தை அணுகவும், ஆவணப் பொருள் மாதிரி (DOM) ஏற்றப்பட்டவுடன் அதன் செயல்பாடுகளைத் தூண்டவும் பயன்படுத்தலாம்.
உதாரணமாக
கீழே கொடுக்கப்பட்டுள்ள உதாரணத்தைப் பின்பற்றுவோம்:
ஏதாவது தட்டச்சு செய்யவும் : < உள்ளீடு வகை = 'உரை' ஐடி = 'txt' இடப்பெயர்ச்சி = 'உரையை உள்ளிடவும்...' >
< பொத்தானை > மதிப்பைப் பெறுங்கள் பொத்தானை >
மேலே உள்ள குறியீட்டு வரிகளில், பின்வரும் படிகளைச் செய்யவும்:
- அதன் முறைகளைப் பயன்படுத்த jQuery நூலகத்தைச் சேர்க்கவும்.
- குறிப்பிடவும் ' உள்ளீடு 'குறிப்பிட்ட மதிப்புகளுடன் உரை புலமாக' ஐடி 'மற்றும்' இடப்பெயர்ச்சி ” முன்பு விவாதித்தபடி.
- மேலும், பொத்தானை கிளிக் செய்வதன் மீது மதிப்பைப் பெற ஒரு பொத்தானை உருவாக்கவும்.
குறியீட்டின் ஜாவாஸ்கிரிப்ட் பகுதிக்குச் செல்லவும்:
< கையால் எழுதப்பட்ட தாள் >$ ( ஆவணம் ) . தயார் ( செயல்பாடு ( ) {
$ ( 'பொத்தானை' ) . கிளிக் செய்யவும் ( செயல்பாடு ( ) {
பணியகம். பதிவு ( $ ( 'உள்ளீடு:உரை' ) . மதிப்பு ( ) ) ;
} ) ;
} ) ;
கையால் எழுதப்பட்ட தாள் >
கூறப்பட்ட படிகளைப் பின்பற்றவும்:
- விண்ணப்பிக்கவும் ' தயார்() 'ஏற்றப்பட்ட DOM இல் மேலும் முறைகளைப் பயன்படுத்துவதற்கான முறை.
- உருவாக்கப்பட்ட பொத்தானை அணுகவும் மற்றும் இணைக்கவும் ' கிளிக்() ”அதற்கான முறை அதன் அளவுருவில் கூறப்பட்ட செயல்பாட்டை இயக்கும்.
- கிளிக்() முறை குறிப்பிட்ட உள்ளீட்டு உரை புலத்தை அணுகும் மற்றும் கன்சோலில் உள்ளிடப்பட்ட உரை மதிப்பை பதிவு செய்யும்.
வெளியீடு
எனவே, வகையின் மதிப்பு கன்சோலில் பதிவு செய்யப்பட்டுள்ளது.
இவை அனைத்தும் ஜாவாஸ்கிரிப்ட் உதவியுடன் உரை பகுதியின் மதிப்பைப் பெறுவதற்கான வெவ்வேறு வழிகள்.
முடிவுரை
' getElementById() 'முறை,' addEventListener() 'முறை அல்லது' jQuery ” ஜாவாஸ்கிரிப்ட்டில் உரை பகுதி மதிப்பைப் பெறப் பயன்படுத்தலாம். getElementById() முறையை உள்ளீடு உரை புலத்தை அணுகவும், உள்ளிடப்பட்ட உரை பகுதி மதிப்பை விழிப்பூட்டல் வழியாகக் காண்பிக்கவும் செயல்படுத்தலாம். addEventListener() முறையைப் பயன்படுத்தி ஒரு ' உள்ளீடு ” நிகழ்வு ஒவ்வொரு உள்ளீட்டின் உரை மதிப்பை அருகருகே பெறும். jQuery ஆனது நேரடியாக பட்டனை அணுகவும் மற்றும் கன்சோலில் உள்ள பட்டனை கிளிக் செய்வதன் மூலம் உள்ளிட்ட உரை மதிப்பை மீட்டெடுக்கவும் பயன்படுத்தப்படலாம். இந்த டுடோரியல் ஜாவாஸ்கிரிப்ட்டில் உரை பகுதி மதிப்பை எவ்வாறு பெறுவது என்பதை விளக்குகிறது.