يعمل مسج واجهة المستخدم

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

تثبيت

من أجل تتبع حالة من المكونات، علينا أولا تعريف دورة حياة كاملة من القطعة. عند تثبيت القطعة وتبدأ دورة الحياة. نحن بحاجة فقط لاستدعاء المكونات في عنصر أو أكثر، وهذا هو الحاجيات المثبتة.

$( "#elem" ).progressbar();

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

$( "#elem" ).progressbar({ value: 20 });

أصدر عدد من الخيارات عند تثبيت بكثير وفقا لاحتياجاتنا. نحن لم يمر أي خيارات استخدام القيم الافتراضية.

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

الطريق

منذ تم تهيئة القطعة، فإننا يمكن الاستعلام مكانتها، أو تنفيذ إجراءات على القطعة. يتم تنفيذ كافة الإجراءات بعد التهيئة في شكل استدعاء الأسلوب. استدعاء الأسلوب على القطعة، يمكننا تمرير اسم الأسلوب إلى البرنامج المساعد مسج. على سبيل المثال، للاتصال على شريط التقدم (progressbar) القطعة value الأسلوب، يجب أن نستخدم:

$( "#elem" ).progressbar( "value" );

إذا يأخذ طريقة المعلمات، ونحن يمكن أن تمر المعلمات بعد اسم الأسلوب. على سبيل المثال، لتمرير معلمة 40 إلى value الطريقة، يمكننا استخدام:

$( "#elem" ).progressbar( "value", 40 );

مثل أساليب مسج أخرى، فإن معظم الحاجيات ربط الأسلوب بإرجاع كائن مسج.

$( "#elem" )
    .progressbar( "value", 90 )
    .addClass( "almost-done" );

الطريقة العامة

كل القطعة لديها مجموعة من الحاجيات التي توفر النهج القائم على وظيفة. ومع ذلك، هناك طرق أن كل ما في وشيوعا هي الحاجيات.

خيار

كما ذكرنا سابقا، يمكننا بعد تهيئة option لتغيير طريقة اختيار. على سبيل المثال، يمكن أن نسميه option لتغيير progressbar طريقة (شريط التقدم) قيمة 30.

$( "#elem" ).progressbar( "option", "value", 30 );

يرجى ملاحظة، وهذا هو قبل نسميه value الأمثلة على أسلوب مختلف. في هذا المثال، فإننا ندعو option الأسلوب، وخيار لتغيير القيمة إلى 30.

يمكننا أيضا الحصول على القيمة الحالية للخيار.

$( "#elem" ).progressbar( "option", "value" );

وبالإضافة إلى ذلك، يمكن أن نعطي option تمرير أسلوب كائن، تحديث خيارات متعددة.

$( "#elem" ).progressbar( "option", {
    value: 100,
    disabled: true
});

كنت قد لاحظت أن option طريقة لديه قيم رمز مسج ونفس العلم واضعة، و .css() و .attr() . والفرق الوحيد هو أنك يجب أن تمر "الخيار" سلسلة كمعلمة الأول.

تعطيل

disable طريقة لتعطيل القطعة. في (progressbar) حالات شريط التقدم، وهذا تغيير نمط بحيث يتم تعطيل شريط التقدم.

$( "#elem" ).progressbar( "disable" );

استدعاء disable الأسلوب هو ما يعادل تعيين disabled الخيار true .

تمكين

enable الأسلوب هو disable النهج عكس ذلك.

$( "#elem" ).progressbar( "enable" );

استدعاء enable طريقة ما يعادل تعيين disabled الخيار false .

هدم

إذا لم تعد بحاجة إلى القطعة، يمكنك تدميره، والعودة إلى علامة الأصلية. وهذا يعني أن إنهاء دورة حياة القطعة.

$( "#elem" ).progressbar( "destroy" );

بمجرد تدمير القطعة، لا يمكنك استدعاء أي أسلوب في المكون، إلا إذا قمت بإعادة تهيئة القطعة. إذا كنت ترغب في إزالة العنصر مباشرة من خلال .remove() ، ويمكن أيضا .html() أو .empty() لتعديل الأجداد، سيتم تدمير هذه القطعة تلقائيا.

القطعة

بعض الحاجيات ولدت عنصر مغلفة أو عناصر مرتبطة العنصر الأصلي يتم قطع. في المثال التالي، widget عوائد العناصر. في المثال شريط التقدم (progressbar)، لا تولد المجمع، widget الأسلوب بإرجاع العناصر الأصلية.

$( "#elem" ).progressbar( "widget" );

حدث

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

$( "#elem" ).bind( "progressbarchange", function() {
    alert( "The value has changed!" );
});

كل حدث له تصحيح المقابل، كخيار لتقديم. يمكننا استخدام شريط التقدم (progressbar) ل change الاستدعاء، وهو ما يعادل ملزم progressbarchange الحدث.

$( "#elem" ).progressbar({
    change: function() {
        alert( "The value has changed!" );
    }
});

المناسبات العامة

معظم الأحداث لالحاجيات المحددة، كل الحاجيات لديها مشتركة create الأحداث. يتم تشغيل الحدث عندما يتم إنشاء القطعة.