ডেটা যাচাইকরণ এবং যাচাইকরণের মতো পরিস্থিতিতে, যখনই ব্যবহারকারী কীবোর্ড থেকে একক চাপা কী প্রকাশ করে তখন ক্ষেত্রের উপাদানগুলির স্টাইল পরিবর্তিত হয়। প্রতিটি কী প্রেস বা রিলিজের সাথে সম্পর্কিত স্টাইলিংয়ের এই পরিবর্তনটি jQuery দ্বারা প্রদত্ত ইভেন্ট হ্যান্ডলারের মাধ্যমে সঞ্চালিত হয়। সুনির্দিষ্টভাবে বলতে গেলে, যে ইভেন্ট হ্যান্ডলার বা পদ্ধতিটি যেটি ফাংশনটি ডিল করে বা আহ্বান করে যখন কোনো চাপা কী রিলিজ হয় তা হল “ কীআপ ()' পদ্ধতি।
অন্যদিকে, যে পদ্ধতিটি ফাংশন কীটি পরিচালনা করে বা আমন্ত্রণ জানায় তা হল ' কীডাউন ()' পদ্ধতি এবং আপনি আমাদের সংশ্লিষ্ট পরীক্ষা করতে পারেন নিবন্ধ এই ইভেন্টের জন্য।
এই ব্লগে, আমরা jQuery keyup() পদ্ধতির একটি সংক্ষিপ্ত বিবরণ প্রদান করব।
কিভাবে jQuery keyup() পদ্ধতি ব্যবহার করবেন?
jQuery ' কীআপ ()' পদ্ধতিটি বেনামী ফাংশনটিকে ট্রিগার করে যখনই ব্যবহারকারী নির্বাচিত ক্ষেত্রের ভিতরে কীগুলি চাপা বা প্রবেশ করা বন্ধ করে। এই পদ্ধতিটি রিয়েল-টাইমে নির্বাচিত উপাদানের উপর গতিশীল স্টাইলিং প্রয়োগ করতেও ব্যবহৃত হয়।
বাক্য গঠন
keyup() jQuery পদ্ধতির জন্য ব্যবহৃত সিনট্যাক্স নিম্নরূপ:
$ ( 'এই' ) . কীআপ ( customFunc )
উপরের সিনট্যাক্সে, ' এই ' হল নির্বাচিত HTML উপাদান, এবং ' customFunc ' একটি ফাংশন যা ' দ্বারা নির্বাহ করা হয় কীআপ 'এর উপরে পদ্ধতি' এই ”
গভীরভাবে বোঝার জন্য কয়েকটি উদাহরণ দেওয়া যাক।
উদাহরণ 1: 'keyup()' পদ্ধতি ব্যবহার করে পাঠ্যের রঙ পরিবর্তন করা
এই ক্ষেত্রে, প্রবেশ করা পাঠ্যের রঙটি একটি ভিন্ন রঙে পরিবর্তিত হতে চলেছে যখন ব্যবহারকারী নীচে দেখানো কীটি ইতিমধ্যেই চাপা কী প্রকাশ করে:
< html >
< মাথা >
< লিপি src = 'https://code.jquery.com/jquery-3.7.0.js' < / লিপি >
< লিপি >
$(ডকুমেন্ট)।রেডি(ফাংশন() {
$('#ডেমো').keyup(function() {
$('#ডেমো').css('রঙ', 'বন সবুজ');
});
});
< / লিপি >
< / মাথা >
< শরীর >
< div >
লিনাক্সহিন্ট ডেটা লিখুন: < ইনপুট আইডি = 'ডেমো' টাইপ = 'পাঠ্য' / >
< / div >
< / শরীর >
< / html >
উপরের কোডের বর্ণনা নিচে উল্লেখ করা হল:
- প্রথমে, এটিতে গিয়ে jQuery এর অনলাইন CDN সন্নিবেশ করে প্রকল্পে আমদানি করুন লিঙ্ক অফিসিয়াল ডকুমেন্টেশনের।
- এরপরে, একটি বেনামী ফাংশন তৈরি করুন যা বলা হবে যখন ' নথি ” অথবা পৃষ্ঠা লোড হয়। এই ফাংশনটি 'ডেমো' আইডি সহ এইচটিএমএল উপাদান নির্বাচন করে এবং সংযুক্ত করে ' কীআপ ()' এর সাথে পদ্ধতি।
- দ্য ' কীআপ ()' পদ্ধতি কলব্যাক ফাংশনকে আহ্বান করে যা ব্যবহার করে ' css ()” টেক্সটের ফন্টের রঙ সেট করতে “ সবুজ অরণ্য ”
- এখন, নির্বাচিত “< তৈরি করুন ইনপুট >' উপাদানের ভিতরে '< শরীর >' ট্যাগ করুন এবং এটির একটি আইডি বরাদ্দ করুন ডেমো ”
সংকলন প্রক্রিয়া শেষ হওয়ার পরে ওয়েবপৃষ্ঠার পূর্বরূপ:
নির্বাচিত কী প্রকাশ করা হলে আউটপুট পাঠ্যের রঙ পরিবর্তন দেখায়।
উদাহরণ 2: গতিশীলভাবে পটভূমির রঙ পরিবর্তন করা
এই উদাহরণে, ব্যবহারকারী চাপা কী ছেড়ে দিলেই নির্বাচিত HTML উপাদানের জন্য বিভিন্ন পটভূমির রঙ সেট করা হবে। আসুন এই দৃশ্যের জন্য কোডটি দেখুন:
< মাথা >< লিপি src = 'https://code.jquery.com/jquery-3.7.0.js' < / লিপি >
< লিপি >
ব্যাকগ্রাউন্ডশেড দিন = [ 'অ্যাকোয়ামেরিন' , 'কমলা লাল' , 'ক্যাডেটব্লু' , 'সবুজ অরণ্য' ,
'উজ্জল ধূসর' , 'বেলে বাদামী' , 'ম্যাজেন্টা' , 'বারলিউড' ] ;
যাক জে = 0 ;
$ ( নথি ) .keyup ( ফাংশন ( ঘটনা ) {
$ ( '#hgg' ) .css ( 'পেছনের রং' , ব্যাকগ্রাউন্ড শেডস [ j ] ) ;
j++;
j = j % 9 ;
} ) ;
< / লিপি >
< / মাথা >
< শরীর >
< h1 শৈলী = 'রঙ: সমুদ্রসবুজ' >লিনাক্সহিন্ট প্রবন্ধ< / h1 < br >
< div আইডি = 'hgg' শৈলী = 'প্যাডিং: 10px' >
< h2 > jQuery কীআপ বিভিন্ন সেট করতে ব্যবহৃত হয় পটভূমি প্রতিবার যখন কী প্রকাশ করা হয়।< / h2 >
< br / >
< / div >
< / শরীর >
উপরের কোডের বর্ণনা:
- প্রাথমিকভাবে, “< এর ভিতরে jQuery CDN যোগ করে আপনার প্রকল্পে jQuery আমদানি করুন মাথা >' ট্যাগ।
- তারপর, 'নামের একটি অ্যারে তৈরি করুন ব্যাকগ্রাউন্ড শেড যা আটটি এলোমেলো রং ধারণ করে।
- পরবর্তী, ' কীআপ ()' পদ্ধতিটি 'এর সাথে সংযুক্ত নথি এবং এটি একটি বেনামী কলব্যাক ফাংশন আহ্বান করে। এই ফাংশনটি “আইডি সহ HTML উপাদান নির্বাচন করে hgg 'এবং CSS প্রয়োগ করে' পেছনের রং 'সম্পত্তি।
- অ্যারে ' ব্যাকগ্রাউন্ড শেড 'কে CSS বৈশিষ্ট্যের মান হিসাবে পাস করা হয় এবং সূচকটি 'এ সেট করা হয় j ' পরিবর্তনশীল। এই ভেরিয়েবলটি প্রতিবার একটি করে বৃদ্ধি পায় এবং 'থেকে পুনরায় চালু হয়' 0 'সূচক যখন মান পৌঁছায়' 8 ” কারণ অ্যারের সর্বোচ্চ সূচক হল “ 7 ”
- এর পরে, একটি নির্বাচিত ' div ' একটি আইডি সহ উপাদান ' hgg ”, চাপা কী রিলিজ হলে এই উপাদানটির পটভূমির রঙ পরিবর্তন হতে চলেছে।
সংকলনের পরে ওয়েবপৃষ্ঠার পূর্বরূপ:
আউটপুট নিশ্চিত করে যে নির্বাচিত এইচটিএমএল উপাদানটির জন্য পটভূমির রঙ প্রতিবার পরিবর্তন হচ্ছে যখন চাপা বা নির্বাচিত কী প্রকাশিত হয়। এটি ব্যবহার সম্পর্কে সবই ' কীআপ ()' পদ্ধতি।
উপসংহার
jQuery ' কীআপ ()' পদ্ধতিটি নির্বাচিত HTML উপাদানে একটি কলব্যাক ফাংশন ট্রিগার করে যখন চাপা কী প্রকাশ করা হয়। এই পদ্ধতিটি যখন কী টিপছে তখন কল করে না কিন্তু রিলিজ করার সময় বা কী আপ করার সময় এই ফাংশনটি একটি কলব্যাক ফাংশন চালায়। এই ব্লগটি jQuery keyup() পদ্ধতির ব্যবহার এবং কাজ ব্যাখ্যা করেছে।