جافا سكريبت المنبثقة

• قد 20, 2024

تم تصميم جافا سكريبت لإضافة التفاعل إلى صفحات الويب ، لذلك ليس من المستغرب أن يكون لديه العديد من الوظائف التي تجعل من السهل جمع المعلومات من مستخدم وعرضه باستخدام مربعات منبثقة. قبل أن ننظر إلى هذه المربعات ، ضع في اعتبارك أنه على الرغم من أنها أبسط طريقة لجمع المعلومات وعرضها ، فإنها ليست بالضرورة الأكثر جاذبية أو سهلة الاستخدام. من بين أمور أخرى ، تتطلب النوافذ المنبثقة من المستخدم الضغط على زر لإغلاق النافذة بعد كل رسالة أو إدخال - وهذا يمكن أن يصبح سريعًا. أيضًا ، من وجهة نظر تصميم الويب ، لديك حقًا تحكم قليل جدًا في عرض المعلومات في الصناديق المنبثقة. ومع ذلك ، في المكان المناسب ، وتستخدم في الاعتدال ، يمكن أن تكون الصناديق المنبثقة بسيطة وفعالة.

هناك ثلاثة أنواع من الصناديق المنبثقة - التنبيه والتأكيد والمطالبة. أبسط وأكثرها شيوعا هو المنبثقة في حالة تأهب. يستغرق التنبيه حجة واحدة - رسالة إلى المستخدم. عندما ينبثق مربع تنبيه ، لا يمكن للمستخدم المتابعة حتى يضغط على زر "موافق". رمز مربع التنبيه بسيط:

تنبيه ("هذا تنبيه")



مربع التأكيد أكثر تعقيدًا بقليل. مثل التنبيه ، تأكيد يأخذ حجة واحدة - الرسالة. عندما ينبثق مربع التأكيد ، يتم منح المستخدم خيار الرد باستخدام أزرار "موافق" أو "إلغاء". بخلاف التنبيه ، التأكيد له قيمة إرجاع - 0 تعني أن المستخدم قام بالضغط على "إلغاء" و 1 تعني "موافق". رمز مربع التأكيد مطابق لمربع التنبيه فيما عدا أنك تريد جمع قيمة الإرجاع بطريقة أو بأخرى:

save_me = confirm ("هذا تأكيد منبثق")



على الرغم من أنها الأكثر تعقيدًا في النوافذ المنبثقة ، إلا أن المطالبة مازالت بسيطة للغاية. يأخذ موجه اثنين من الوسائط - رسالة إلى المستخدم والقيمة الافتراضية (أو "إذا كنت لا تريد أي قيمة افتراضية.) عندما ينبثق مربع المطالبة ، يمكن للمستخدم إدخال المعلومات المطلوبة والضغط على" موافق ". هناك أيضًا زر "إلغاء". قيمة الإرجاع هي استجابة المستخدم. إذا ألغى المستخدم قيمة الإرجاع هي لا شيء. إذا تركوا مربع المطالبة فارغًا ، فستكون قيمة الإرجاع هي السلسلة الفارغة (""). ربما تريد التحقق من هذه القيم والقيام بشيء خاص بدلاً من الاستخدام لا شيء أو السلسلة الفارغة كردهم. رمز مربع المطالبة هو:

استجابة = موجه ("هذه مطالبة" ، "استجابة هنا")



يمكنك عرض عرض توضيحي لهذه الصناديق المنبثقة هنا

---

تعليمات الفيديو: طريقة عمل نافذة منبثقة بالجافا سكربت Modal (قد 2024).