ஜாவாஸ்கிரிப்டில் டேப் கீயை எவ்வாறு கண்டறிவது

Javaskiriptil Tep Kiyai Evvaru Kantarivatu



கேஸ்-சென்சிட்டிவ் உறுப்பைக் கொண்ட இணையதளங்கள் அல்லது இணையப் பக்கங்களை நாங்கள் அடிக்கடி சந்திக்கிறோம். மேலும், சில இணையப் பக்கங்கள், குறிப்பாக கடவுச்சொற்களின் விஷயத்தில், கேப்ஸ் லாக் போன்ற குறிப்பிட்ட விசையை அழுத்தும் வரை தரவை உள்ளிட அனுமதிக்காது. இதுபோன்ற சந்தர்ப்பங்களில், ஜாவாஸ்கிரிப்டில் டேப் விசையைக் கண்டறிவது, உள்ளிடப்பட்ட தரவைப் பயனரை முன்கூட்டியே எச்சரிக்க மிகவும் உதவியாக இருக்கும்.

ஜாவாஸ்கிரிப்டில் டேப் கீயைக் கண்டறிய இந்த எழுதுதல் உங்களுக்கு வழிகாட்டும்.

ஜாவாஸ்கிரிப்டில் டேப் கீயை எவ்வாறு கண்டறிவது?

ஜாவாஸ்கிரிப்டில் டேப் கீயைக் கண்டறிய, பின்வரும் நுட்பங்களைப் பயன்படுத்தவும்:







  • ' querySelector() ”முறை
  • ' getElementbyId() ”முறை

குறிப்பிடப்பட்ட அணுகுமுறைகள் ஒவ்வொன்றாக நிரூபிக்கப்படும்!



முறை 1: document.querySelector() முறையைப் பயன்படுத்தி JavaScript இல் டேப் கீயைக் கண்டறிதல்

' document.querySelector() ”முறையானது CSS தேர்வியுடன் பொருந்தக்கூடிய முதல் உறுப்பை அணுகுகிறது, பின்னர் addEventListener() முறை அணுகப்பட்ட உறுப்புடன் நிகழ்வு கையாளுதலைச் சேர்க்கிறது. உள்ளீட்டு வகையை அணுகவும், அதன் மதிப்பை உள்ளிடும்போது தாவல் விசை அழுத்தப்பட்டதா இல்லையா என்பதைக் கண்டறியவும் இந்த முறைகளைப் பயன்படுத்தலாம்.



தொடரியல்





உறுப்பு. addEventListener ( நிகழ்வு , செயல்பாடு , பிடிப்பு பயன்படுத்தவும் )

கொடுக்கப்பட்ட தொடரியல், ' நிகழ்வு 'நிகழ்வின் பெயரைக் குறிக்கிறது,' செயல்பாடு 'நிகழ்வு நிகழும்போது செயல்படுத்துவதற்கான குறிப்பிட்ட செயல்பாடு, மற்றும் ' பிடிப்பு பயன்படுத்தவும் ” என்பது விருப்ப வாதம்.

ஆவணம். querySelector ( CSS தேர்வாளர்கள் )

மேலே உள்ள தொடரியல், “ CSS தேர்வாளர்கள் ” ஆவணம்.querySelector() முறையில் குறிப்பிடக்கூடிய ஒன்று அல்லது அதற்கு மேற்பட்ட CSS தேர்வாளர்களைப் பார்க்கவும்.



கூறப்பட்ட கருத்தை நன்கு புரிந்து கொள்ள பின்வரும் உதாரணத்தைப் பார்க்கவும்.

உதாரணமாக
முதலில், உள்ளீட்டு வகையை ' உரை ” ஆரம்ப ஒதுக்கீட்டு மதிப்பு மற்றும் “ என்ற தலைப்பில் 'குறிச்சொல்:

< உள்ளீடு வகை = 'உரை' இடப்பெயர்ச்சி = 'உரையை உள்ளிடவும்' >
< h2 > விளைவாக < / h2 >

அடுத்து, விண்ணப்பிக்கவும் ' document.querySelector() 'குறிப்பிட்ட உள்ளீடு மற்றும் தலைப்பை முறையே அணுகுவதற்கான முறை மற்றும் அவற்றை ' என்ற மாறிகளில் சேமிக்கவும். உள்ளீடு 'மற்றும்' விளைவாக ”:

உள்ளீடு அனுமதிக்க = ஆவணம். querySelector ( 'உள்ளீடு' ) ;
முடிவு செய்யட்டும் = ஆவணம். querySelector ( 'h2' ) ;

இப்போது, ​​சேர் ' கீ டவுன் ” addEventListener() முறையைப் பயன்படுத்தி உள்ளீட்டு புலத்துடன் நிகழ்வு. இந்த நிகழ்வு பயனருக்கு தெரிவிக்கும் ' தாவல் 'உள்ளீட்டு புலத்தில் பின்வரும் நிபந்தனையைப் பயன்படுத்தி ' விசை அழுத்தப்படுகிறது உள் உரை 'சொத்து:

உள்ளீடு. addEventListener ( 'கீடவுன்' , ( மற்றும் ) => {
என்றால் ( மற்றும். முக்கிய === 'தாவல்' ) {
விளைவாக. உள் உரை = 'தாவல் விசை அழுத்தப்பட்டது' ;
} வேறு {
விளைவாக. உள் உரை = 'தாவல் விசை அழுத்தப்படவில்லை' ;
}

இந்த வழக்கில், பயனர் தாவல் விசையை அழுத்தும்போது, ​​​​சேர்க்கப்பட்டவர் நிகழ்த்தப்பட்ட செயலைப் பற்றி அறிவிக்கும்:

முறை 2: ஆவணம்.getElementbyId() முறையைப் பயன்படுத்தி ஜாவாஸ்கிரிப்டில் டேப் கீயைக் கண்டறியவும்

' document.getElementById() ஒரு குறிப்பிட்ட HTML உறுப்பை அதன் ஐடியின் அடிப்படையில் அணுகுவதற்கு ” முறையைப் பயன்படுத்தலாம். உள்ளீட்டு புலத்தைப் பெறவும், டேப் விசை போன்ற குறிப்பிட்ட விசையை அழுத்தும் போதெல்லாம் பயனரை எச்சரிக்க ஒரு நிகழ்வைச் சேர்க்கவும் இந்த முறையைச் செயல்படுத்தலாம்.

தொடரியல்

ஆவணம். getElementById ( உறுப்புகள் )

கொடுக்கப்பட்ட தொடரியல், ' உறுப்புகள் ” என்பது ஒரு குறிப்பிட்ட உறுப்பின் ஐடியைக் குறிக்கிறது.

பின்வரும் உதாரணத்தை மேலோட்டமாகப் பார்ப்போம்.

உதாரணமாக
கீழே உள்ள எடுத்துக்காட்டில், முந்தைய முறையில் விவாதிக்கப்பட்டபடி உள்ளீட்டு வகை மற்றும் ஒதுக்கிட மதிப்பைச் சேர்க்கவும்:

< உள்ளீடு வகை = 'உரை' ஐடி = 'தாவல்' இடப்பெயர்ச்சி = 'உரையை உள்ளிடவும்' >

இப்போது, ​​'ஐப் பயன்படுத்தி உள்ளீட்டு புல ஐடியைப் பெறவும் document.getElementById() ”முறை.

input= document.getElementById(“tab”)ஐ விடுங்கள்;

இறுதியாக, '' என்ற நிகழ்வைச் சேர்க்கவும் கீ டவுன் ” addEventListener() முறையில், இது எப்போது வேண்டுமானாலும் பயனரை எச்சரிக்கும் தாவல் 'விசை அழுத்தப்படுகிறது:

உள்ளீடு. addEventListener ( 'கீடவுன்' , ( மற்றும் ) => {
என்றால் ( மற்றும். முக்கிய === 'தாவல்' ) {
எச்சரிக்கை ( 'தாவல் விசை அழுத்தப்பட்டது' ) ;
}
} ) ;

வெளியீடு

ஜாவாஸ்கிரிப்டில் டேப் விசையைக் கண்டறிவதற்கான அனைத்து எளிய முறைகளையும் நாங்கள் விவாதித்தோம்.

முடிவுரை

ஜாவாஸ்கிரிப்டில் டேப் விசையைக் கண்டறிய, '' ஐப் பயன்படுத்தவும் addEventListener() ' உடன் ' document.querySelector() 'உள்ளீட்டு வகையைப் பெறுவதற்கான முறை மற்றும் குறிப்பிட்ட விசையைக் கண்டறிவதற்கான நிகழ்வைப் பயன்படுத்துதல் அல்லது ' getElementbyId() ” ஐடியின் அடிப்படையில் உள்ளீட்டு புலத்தைப் பெறுவதற்கான முறை மற்றும் சேர்க்கப்பட்ட நிபந்தனை திருப்திகரமாக இருக்கும் போது பயனருக்குத் தெரிவிக்கும். இந்த வலைப்பதிவு JavaScript இல் டேப் விசையைக் கண்டறிவது பற்றி வழிகாட்டுகிறது.