كيف أجعل واجهة المستخدم الخاصة بي "تتحلل بأمان" مع تعطيل JavaScript؟

Question

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

لدي نقطة من HTML لتكوين "جدول". اعتمادًا على قيمة مربع تحديد ، يتم عرض حقول مختلفة.

<select name="schedule.frequency"
    id="schedule.frequency" 
    onChange='updateScheduleFields()' >
        <option value="Manual">Run Manually</option>
        <option value="Monthly">Monthly</option>
        <option value="Weekly">Weekly</option>
        <option value="Daily">Daily</option>
        <option value="Hourly">Hourly</option>
</select>

عندما يتم تحديث SELECT ، أخفي الحقول التي يتم عرضها بحيث لا يتم عرض أشياء مثل "يوم الأسبوع" أو "أيام الشهر" عندما يكون غير مناسب. لست متأكدًا حقًا من كيفية إجراء هذا التحلل بأمان بدون JavaScript ، لأنه كما هو مذكور ، فإن بعض الحقول غير ملائمة تمامًا لأنواع الجدول الزمني المختلفة.

سؤالي هو: بشكل عام ، كيف أقوم بعمل شيء يعطل/يخفي حقولًا غير لائقة أو تتحلل بعض المعالجة قبل/ما بعد ذلك بشكل صحيح بدون JavaScript؟

سأكون مهتمًا أيضًا بمواقع محددة يمكنني النظر فيها إلى هذا النوع من التدهور جيدًا؟

Answer 1

الفكرة الأساسية هي أن لديك طريقة قياسية (غير JS) للقيام بشيء ما ، ثم تضيف JavaScript لتجاوز هذا السلوك الافتراضي.

في حالتك ، لديك ملف select, ، وبالتالي فإن سلوك غير JS هو أنه عند تحديد خيار ، يمكنك إرسال نموذج يقوم بتحميل إصدار جديد من الصفحة مع حقول مختلفة معروضة.

سيخفي JavaScript (إذا تم تمكينه) زر الإرسال وإجراء التحديث في مكانه.

الطريقة المفضلة للتفكير في الأمر تحسين تدريجي, ، ومن الأسهل بكثير تحقيق هذه الطريقة. اجعل صفحتك تعمل كـ HTML Barebones ، ثم تعززها تدريجياً مع CSS و JavaScript. ثم لا تضطر أبدًا إلى العمل إذا كان سيتحول بأمان.

من الأسهل إجراء تحسين تدريجي إذا كانت JavaScript و CSS في ملفات منفصلة بدلاً من مضمنة. مع مكتبة Ajax مثل JQuery*، يمكنك تحديد عناصر مع محددات CSS لإضافة سلوك إلى تلك العناصر. في حالتك ، ستفعل $('#schedule_frequency').change(updateScheduleFields) (لا أعتقد أنه يجب أن يكون لديك فترة في هويتك).

* إخلاء المسئولية: من الممكن تحديد عناصر HTML في JavaScript بدون مكتبة ، ومكتبات Ajax بخلاف jQuery.

Answer 2

عندما تفكر في المواقع المهينة بأمان ، فكر في كيفية استخدامك للموقع دون أي جافا سكريبت. ثم استخدم javaScript و Onload/Wok لتغيير عناصر موقعك إلى ما تريده في الأصل مع JavaScript. وبهذه الطريقة ، إذا تم تعطيل JavaScript ، فإن الموقع يعمل. إذا تم تمكينه ، فسيقوم إعداد JavaScript بتشغيل الصفحة وتحويلها.

عادةً ما يعني هذا زر "إرسال" إضافي يخفيه إعداد JavaScript أو شيء من هذا القبيل.

Answer 3

ما سأفعله في هذه الحالة هو زر "التالي" أسفل القائمة المنسدلة التي تنشر التحديد إلى الخادم. ثم ستحتاج إلى منطق من جانب الخادم لإظهار/إخفاء الحقول. عادةً ما أقوم بعملها بهذه الطريقة أولاً ، ثم أعود وأضف JavaScript Flair لإخفاء الزر ومنع الرحلة المستديرة.

Answer 4

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

بالإضافة إلى ذلك ، لن تقوم بالمعالجة المسبقة بدون JavaScript. ستحتاج إلى تنفيذ الفحص / الاختبار في النهاية الخلفية.