একটি অনলাইন কুইজ অ্যাপ্লিকেশনে জাভাস্ক্রিপ্ট কাউন্টডাউন টাইমার প্রয়োগ করা

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

আপনি এখানে প্রথম অংশ পড়তে পারেন ।আপনি গ্রহণ করে আপনার কৌণিক কেরিয়ারের সুযোগগুলি প্রসারিত করতে পারেন ।

জাভাস্ক্রিপ্ট কাউন্টডাউন টাইমার

প্রতিটি কুইজের সময়কাল কুইজ এক্সএমএল ফাইলে সংরক্ষণ করা হয়, আমরা কুইজের সময়কালটি পুনরুদ্ধার করি এবং এটি একটি বৈশিষ্ট্য হিসাবে ব্যবহারকারীর সেশনে সংরক্ষণ করি। যখন ব্যবহারকারী কোনও প্রশ্ন জমা দেয় আমরা জাভাস্ক্রিপ্টের সাথে কাস্টম ফর্ম জমা ব্যবহার করে নিয়ামকের কাছে সময়ও জমা দেব। সুতরাং, যখন আমরা পরবর্তী প্রশ্নটি দেখি আমরা সঠিক সময়টি প্রদর্শন করি।

কুইজের সময়কাল শেষ হয়ে গেলে ব্যবহারকারীকে 'টাইম আপ' বলে একটি সতর্কতা বাক্স প্রদর্শিত হবে এবং কুইজের মূল্যায়ন হবে এবং চূড়ান্ত ফলাফলটি প্রদর্শিত হবে।

কিভাবে জাভা এলোমেলো স্ট্রিং তৈরি করতে হয়

আসুন দেখুন আমাদের এটি অর্জনের জন্য কী দরকার।

কুইজ প্রশ্নের আগে আমরা কুইজ এক্সএমএল ফাইলটিতে দুটি নতুন লাইন যুক্ত করেছি।

জাভা কুইজ (2015/01/18) 10 2 সঠিক বাক্য গঠন কোনটি? পাবলিক ক্লাস এ বি সি প্রসারিত কিউডব্লিউই শিক্ষার্থীদের প্রসারিত i = 'এ' স্ট্রিং এস = 'হ্যালো' প্রাইভেট ক্লাস এবিসি 2 নীচের কোনটি জাভাতে কোনও কীওয়ার্ড নয়? বর্গ ইন্টারফেস বিমূর্ততা প্রসারিত 3 জাভা সম্পর্কে সত্য কি? জাভা প্ল্যাটফর্ম নির্দিষ্ট, জাভা একাধিক উত্তরাধিকার সমর্থন করে না জাভা লিনাক্সে চলে না এবং ম্যাক জাভা বহু-থ্রেডযুক্ত ভাষা নয় 1 নীচের কোনটি একটি ইন্টারফেস? থ্রেড চলমান তারিখ ক্যালেন্ডার 1 কোন সংস্থা জাভা সংস্করণ 8 প্রকাশ করেছে? সান ওরাকল অ্যাডোব গুগল 1 জাভা কোন বিভাগের অধীনে আসে? প্রথম প্রজন্মের ভাষাগুলি দ্বিতীয় প্রজন্মের ভাষা তৃতীয় প্রজন্মের ভাষাগুলি চতুর্থ প্রজন্মের ভাষা 2 আপনার প্রোগ্রামটিতে স্বয়ংক্রিয়ভাবে দৃশ্যমান ডিফল্ট প্যাকেজটি কোনটি? java.net javax.swing java.io java.lang 3 ওয়েব-আইএনএফ-এ কোন প্রবেশ কোন সার্লেটের মানচিত্রের জন্য ব্যবহৃত হয়? সার্লেট-ম্যাপিং সার্লেট-রেজিস্ট্রেশন সার্লেট-এন্ট্রি সার্লেট-সংযুক্তি 0 জাভা ডেটাটাইপ ইন্টের দৈর্ঘ্য কত? 32 বিট 16 বিট 64 বিট রানটাইম নির্দিষ্ট 0 0 জাভা ডেটাটাইপ বুলিয়ানের ডিফল্ট মান কত? সত্য মিথ্যা 1 0 1

একটি নতুন পরীক্ষা শুরু করার সময় টাইমার সেট করা

যখন ব্যবহারকারী কোনও নতুন পরীক্ষা শুরু করে, আমরা ব্যবহারকারীর সেশনে কুইজের মোট প্রশ্ন এবং সময়কালকে একটি বৈশিষ্ট্য হিসাবে সেট করি।

অনুরোধ.সেটসেশন () .সেটআট্রিবিউট ('টোটালNumberOfQuizQuestions', ডকুমেন্ট.সেটমেন্টস বিট্যাগনাম ('টোটাল কুইজকিউশনস')। আইটেম (0) .getTextContent ()) অনুরোধ.কেট সেশন ()। সেটএট্রিবিউট ('কুইজডিউরেশন', ডকুমেন্ট.সেটমেন্টস বিটিজাইমেশন ') .item (0) .getTextContent ()) request.getSession ()। setAttribute ('min', document.getElementsByTagName ('quizD अवधि')। আইটেম (0) .getTextContent ()) অনুরোধ.সেটসেশন ()। setAttribute ('সেকেন্ড ', 0)

কাউন্টডাউন সময়

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

কাউন্টডাউন সময় জাভাস্ক্রিপ্ট ফাংশন

var টিম টাইম মিনিট = '$ {সেশনস্কোপ.মিন' var 'ভার সেকেন্ড =' $ {সেশনস্কোপ.সেক} 'ভার এফ = নতুন তারিখ () ফাংশন কাস্টমসবমিট (কিছু ভ্যালু) {ডকুমেন্ট.কোশনফর্ম.মুনিউট.ভ্যালু = মিনিট ডকুমেন্ট.কোশনফর্ম। সেকেন্ড.ভ্যালু = সেকেন্ড ডকুমেন্টস.কশনফর্ম.সুবমিট ()} ফাংশন পরীক্ষাটাইমার () {যদি (পার্সেন্ট (সেকেন্ড)> 0) {ডকুমেন্ট.জেট এলিমেন্টবাইআইডি ('শোটাইম')। ইনার এইচটিএমএল = 'সময় বাকি:' + মিনিট + 'মিনিট,' + সেকেন্ড + 'সেকেন্ড' সেকেন্ড = পার্সেন্ট (সেকেন্ড) - 1 টিম = সেটটাইমআউট ('পরীক্ষাটাইমার ()', 1000)} অন্য {যদি (পার্সেন্ট (মিনিট) == 0 && পার্সেন্ট (সেকেন্ড) == 0) {ডকুমেন্ট.সেটিমেন্টবিআইআইডি ('শোটাইম')। অভ্যন্তরীণ এইচটিএমএল = 'সময় বাকী রয়েছে:' + মিনিট + 'মিনিট,' + সেকেন্ড + 'সেকেন্ড' সতর্কতা ('সময় শেষ') ডকুমেন্ট.কোশনফর্ম.মিনিউট.ভ্যালু = 0 ডকুমেন্ট.কোশনফর্ম.সেকেন্ড.ভালিউ = 0 ডকুমেন্ট .questionForm.submit ()} if (parseInt (সেকেন্ড) == 0) {ডকুমেন্ট.getElementById ('শোটাইম')। অভ্যন্তরীণ এইচটিএমএল = 'সময় বাকী:' + মিনিট + 'মিনিট,' + সেকেন্ড + 'সেকেন্ড' মিনিট = পার্সেন্ট (মিনিট) ) - 1 সেকেন্ড = 59 টিম = সেটটাইমআউট ('পরীক্ষাটাইমার ()', 1000)}}}

জাভাস্ক্রিপ্ট ফাংশন কল কিভাবে

এখন, সেই জাভাস্ক্রিপ্ট ফাংশনটি কল করতে আমরা বডি ট্যাগের ওভারলোড বৈশিষ্ট্যটি ব্যবহার করতে যাচ্ছি।

পরীক্ষা নিয়ন্ত্রকের কাছে কুইজের সময় জমা দেওয়া

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

জাভাস্ক্রিপ্ট ব্যবহার করে ফর্ম জমা দেওয়া

নোট করুন যে ব্যবহারকারী যখন পরবর্তী, পূর্ববর্তী বা ফিনিস বোতামটি কাস্টম সাবমিট () জাভাস্ক্রিপ্ট ফাংশন কল করা হবে ক্লিক করুন।

{{পছন্দ} 
  
0} '>
সময় আপ পরিচালনা
যখন কুইজের সময়কাল শেষ হয়ে যায়, অন্য কথায় যখন মিনিট এবং দ্বিতীয় উভয়ই শূন্য হয়ে যায়। আমরা 'টাইম আপ' বলে একটি সতর্কতা বাক্স দেখি এবং মিনিটের এবং দ্বিতীয়টির মান শূন্য করে ফর্মটি জমা দিন।
if (parseInt (min) == 0 && parseInt (সেকেন্ড) == 0) {ডকুমেন্ট.getElementById ('শোটাইম')। অভ্যন্তরীণ এইচটিএমএল = 'সময় বাকি:' + মিনিট + 'মিনিট,' + সেকেন্ড + 'সেকেন্ড' সতর্কতা ('সময় আপ ') ডকুমেন্ট.কোশনফর্ম.মিনিউট.ভ্যালু = 0 ডকুমেন্ট.কোশনফর্ম.সেকেন্ড.ভালিউ = 0 ডকুমেন্ট.কোশনফর্ম.সুম্মিট ()}
আমাদের কোডটি পরিবর্তন করতে হবে যাতে পরীক্ষার সময়সীমা শেষ হয়ে গেলে পরীক্ষা শেষ হবে।
অন্যথায় যদি ('পরীক্ষার সমাপ্তি'.Equals (ক্রিয়া) || (মিনিট == 0 && দ্বিতীয় == 0)) {সমাপ্তি = সত্যিকারের ফলাফল = exam.calculateResult (পরীক্ষা) অনুরোধ.setAttribute (' ফলাফল ', ফলাফল) অনুরোধ .সেটসেশন ()। সেটঅ্যাট্রিবিউট ('কারেন্টএক্সাম', নাল) রিকুয়েস্ট.কেট রিকুইয়েস্টডিস্প্যাচার ('/ ওয়েবে-আইএনএফ / জেএসপিএস / রেজাল্ট.জেএসপি')। ফরোয়ার্ড (অনুরোধ, প্রতিক্রিয়া)
সুতরাং, কোনও পরীক্ষা সরাসরি ফিনিস বোতামে ক্লিক করে বা পরীক্ষার সময়সীমা শেষ হয়ে গেলে (মিনিট এবং দ্বিতীয় উভয়ই শূন্য হয়ে যায়) শেষ করা যায়।
এটাই এই পোস্টের জন্য। পরবর্তী পোস্টে আমরা আমাদের কুইজ অ্যাপ্লিকেশনটিকে আরও প্রসারিত করব এবং একটি নতুন বৈশিষ্ট্য যুক্ত করব যাতে ব্যবহারকারী তার উত্তরগুলি পর্যালোচনা করতে সক্ষম হবে এবং কোন প্রশ্নগুলি সে ভুল পেয়েছে এবং সঠিক উত্তরগুলি কী তা জানতে সক্ষম হবে।
সর্বদা হিসাবে আপনি কোডটি ডাউনলোড করতে পারেন, নিজের পছন্দ মতো পরিবর্তন করুন। এটি কোড বোঝার সেরা উপায়। আপনার যদি কোন প্রশ্ন বা অনুরোধ থাকে তবে নীচে মন্তব্য করুন।
কোডটি ডাউনলোড করতে ডাউনলোড বোতামে ক্লিক করুন।
 আমাদের জন্য একটি প্রশ্ন আছে? দয়া করে মন্তব্য বিভাগে এটি উল্লেখ করুন এবং আমরা আপনার কাছে ফিরে আসব। 
 সম্পর্কিত পোস্ট: 
  
হ্যাশম্যাপ এবং হ্যাশটেবলের মধ্যে পার্থক্য কী