التفاعل مع المستخدمين بشكل بسيط بالجافا سكربت

يوجد لدينا العديد من الطرق لكي يتم تفاعل المستخدمين مع المتصفح في الجافا سكربت ، مثلاََ يمكنك تفاعل معه عند ضغط على شىء معين او عند الاقتراب على شىء معين ، ولكن في هذا المقالة البسيطة سنتعرف على شىء اكثر بساطة بحيث يكون هناك نوع من التفاعل وإمكانك اخد بعض المعلومات من المستخدم او جعله يقوم بتنفيذ امر معين بعد موافقته .

التعامل مع prompt

يمكنك من خلالها سؤال المستخدم سؤال معين واعطائه نتيجة بناءاََ على هذه الاجابة ، والتعامل معها سهل وبسيط جداََ

prompt("What's Your Name ?");

في المثال السابق قمنا بسؤال المستخدم عن اسمه ، وستجد ان هناك حقل يمكن من خلاله كتابه اسمه والنتيجة ستكون كالتالي:

أكوادي - Akwade - تصميم مواقع

يمكن ان يكون ان تقوم بوضع قيمة افتراضية في داخل الحقل الموجود كالتالي:

prompt("What's Your Name ?", 'Please Write Your Name Here');

وستكون النتيجة كالتالي:

أكوادي - Akwade - تصميم مواقع

ايضاََ يمكننا التعامل مع القيمة التي سيقوم بكتابتها الزائر في داخل الحقل من خلال وضعها في متغير والتعامل معها كالتالي:

let yourName = prompt("What's Your Name ?", 'Please Write Your Name Here');
console.log('Welcome ' + yourName);

قيمة هذا المتغير ستكون هو النص الذي يقوم بكتابته الزائر في حقل الخاص بـ prompt ولو فرضنا قمنا بكتابة هذه القيمة في الحقل Mohammed بعد الضغط على Ok ستجد هذه النتيجة في الكونسول Welcome Mohammed .

التعامل مع confirm

ايضاََ تعتبر هذه من الرسائل التي يتعامل معها المستخدمين وبناء على اختياره يمكنك عمل أمر معين ، ويمكن كتابتها كالتالي:

confirm("Are You Sure ...?");

وستكون النتيجة بهذا الشكل:

أكوادي - Akwade - تصميم مواقع

عند الضغط على Ok ستكون النتيجة true ويمكن عمل امر معين بناء على ذلك ، ونفس الشىء عند الضغط على cancel يمكنك تنفيذ شرط أخر ..

يتم استخدام هذا الأمر بكثر عندما تريد حذف شىء معين ، ولكن قبل الحذف تتأكد من المستخدم انه متأكد من انه يريد حذف هذا العنصر وبعد الضغط على ok يتم تأكيد امر الحذف وحذف العنصر.

اترك تعليقاً

لن يتم نشر عنوان بريدك الإلكتروني. الحقول الإلزامية مشار إليها بـ *

Scroll to Top