icteck
ميزة:
1. يتم تنفيذ نفس الأداء على متصفحات مختلفة (بما في ذلك IE6+) والأجهزة - بما في ذلك أجهزة سطح المكتب والأجهزة المحمولة
2. دعم أجهزة اللمس - iOS و Android و BlackBerry و Windows Phone وغيرها من الأنظمة
4. التخصيص المريح - استخدم HTML و CSS لتصميمه (مجموعات متعددة من الجلود)
5. الحجم الصغير - 1 كيلو بايت فقط بعد ضغط GZIP
6. يتم استخدام 25 المعلمات لتخصيص مربعات الاختيار وأزرار الراديو.
7. 8 يتم استخدام أحداث رد الاتصال للاستماع إلى حالة مربع الإدخال.
8. يتم استخدام 7 طرق للتحكم برنامجيا في حالة مربع الإدخال
9. يمكن مزامنة تغييرات الحالة في مربع الإدخال مرة أخرى إلى مربع الإدخال الأصلي ، ودعم جميع المحددات
كيفية استخدام:
$ ('INPUT'). icheck ('check') ؛ // قم بتعيين حالة مربع الإدخال للتحقق
$ ('INPUT'). icheck ('uncheck') ؛ // إزالة حالة الفحص
$ ('INPUT'). icheck ('Toggle') ؛ // تبديل الحالة فحص
$ ('INPUT'). icheck ('Disable') ؛ // اضبط حالة مربع الإدخال على تعطيل
$ ('INPUT'). icheck ('enable') ؛ // إزالة الحالة المعوقة
$ ('INPUT'). icheck ('Update') ؛ // تطبيق تغييرات المدخلات ، والتي تم إجراؤها خارج المكون الإضافي
$ ('INPUT'). icheck ('DestRED') ؛ // إزالة نمط icheck
عند الاتصال بـ ICheck ، تحتاج فقط إلى سرد المعلمات التي عدلت القيمة الافتراضية:
// طريقة الاستخدام الأساسية $ ('INPUT'). icheck ({labelhover: false ، cursor: true ، checkboxclass: 'icheckbox_square-blue' ، radioclass: 'iradio_square-blue' ، reveasearea: '20 ٪ '}) ؛فيما يلي قائمة المعلمات وقيمها الافتراضية:
{handle: '' ، checkboxclass: 'icheckbox' ، radioclass: 'iradio' ، checkedClass: 'checked' ، checkedCheckBoxClass: '' ، checkedRadioclass: '' ، '' ، uncheckedcheckboxclass: '، uncheckedcheckclass:' '، uppliableclass:' '،' ، '،' ، '،' ، '،' ، '، "'، disabledCheckBoxClass:' '، uppluppleCheckBoxClass:' '، enupplicheckboxclass:' '، enabledradioclass:' '، enabledradioclass:' '، enabledradioclass:' '، enableradioclass:' '، ensableclass:' '، enabledradi: "،" ، EnupplyRadiOclass: '' ، EnupplyRadiOclass: '' ، EnupplyRadioClass: '' ، EnupplyRadioClass: '' ، EnupplyRadioClass: '' ، enuppertradioclass: '' ، enabledradioClass: '' ، entableRadioclass: '' ، 'Hover: "Hover:" Hover: "Hover:" Hover " ActivEclass: 'Active' ، labelhover: true ، labelhoverclass: 'hover' ، regreasearea: '' ، ugrsor: false ، errantclass: false ، errantid: false ، insert: ''}يمكننا إعادة ضبط النمط إلى أي من الفئة المذكورة أعلاه
جلد
أسود - الحد الأدنى. css // الأسود
الأحمر - الأحمر. css // الأحمر
الأخضر - الأخضر. css // الأخضر
الأزرق - الأزرق. css // الأزرق
Aero - aero.css // تأثير الزجاج في Win7
رمادي - grey.css // Silver Gray
Orange - Orange.css // Orange
أصفر - أصفر. css // الأصفر
الوردي - الوردي. css // الوردي
الأرجواني - الأرجواني. css // الأرجواني
(يرجى تنزيل حزم الجلد هذه بنفسك)
التهيئة
أولاً ، قدم ملف مكتبة jQuery
ثانياً ، قدم ملف البرنامج المساعد jquery.icheck.js
(إذا كنت ترغب في تقديم جلود ذات صلة ، فأنت بحاجة إلى تقديم: ملفات السمة ذات الصلة. ملفات CSS)
حدث رد الاتصال
يدعم ICheck جميع المحددات ويعمل فقط في مربع الاختيار مربع الاختيار وأزرار الراديو
يوفر ICheck عددًا كبيرًا من أحداث رد الاتصال ، والتي يمكن استخدامها جميعًا للاستماع إلى تغيير أحداث
استخدم طريقة On () لربط الأحداث:
$ ('input'). on ('ifchecked' ، function (event) {// efcreated event يجب أن يكون مرتبطًا بالتنبيه (event.type + 'callback') ؛}) ؛ هل يمكن تغيير حجم الراديو ومربع الاختيار في bootstrap icheck؟ .icheckbox_square-blue ، .iradio_square-blue {display: block ؛ الهامش: 0 ؛ الحشو: 0 ؛ العرض: 22px ؛ الارتفاع: 22px ؛ الخلفية: url (blue.png) عدم التكرار ؛ الحدود: لا شيء ؛ المؤشر: مؤشر. }إذا كنت ترغب في ضبط نمط الراديو أو مربع الاختيار في ICHECK ، فقم بتعديل العرض والارتفاع من خلال CSS أعلاه ، وفي الوقت نفسه ، قم بتعديل الحجم المقابل لصورة plin.png.
دعونا نرى كيفية الحصول على قيمة الراديو
بالنسبة للمجموعة التالية من أجهزة الراديو ، كيف يمكنك الحصول على قيمة القيمة 1 أو 0 عند استخدام ICheck؟
ما ورد أعلاه هو خانة الاختيار المكانية ICheck وراديو Bootstrap الذي قدمه لك المحرر. آمل أن يكون ذلك مفيدًا لك. إذا كان لديك أي أسئلة ، فيرجى ترك رسالة لي وسوف يرد المحرر إليك في الوقت المناسب. شكرا جزيلا لدعمكم لموقع wulin.com!