معربا عن تكنولوجيا المعلومات

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

المشكلة: لا يعتمد الكائن هذه الخاصية أو الأسلوب (على خط 3)

function funzoneSP(){ document.getElementById('video_id').style.visibility="hidden"; shortdesc = document.getElementById('shortdesc').value; .... } 

الحل:
يتم إنشاء خطأ على thirdrow في المثال أعلاه (الخط 3 ... "shortdesc = document.getE ..."). حاولت كل نوع من أشياء غبية، أنا لا أميل أن يستحق حتى الإشارة هنا، وتخمين ما في النهاية! مجرد تغيير فار shortdesc إلى شيء آخر تخلصوا من الخطأ. في الأساس! وكان اسم المتغير إلى مختلف عن fieldID

هذه المدرسة القديمة، ولكن كالعادة هو تكملة ذاكرتي ...
لذلك تم تعطيل = "صحيح"، وتعطيل = "كاذبة" واحد؟ نعم
... لا أعتقد، أيضا! ثت النحو الذي هي عليه ... وهنا بعض شرح سريع ...
"تعطيل" هي سمة من سمات العنصر شكل أي / حقل، وبالتالي لا يمكن أن يقبل أي قيمة بطبيعته.

ما دامت هذه السمة موجودة، سيتم تعطيل العنصر بغض النظر عن قيمتها. لعلى سبيل المثال.
<input type="text" value="This هو disabled" disabled>
<input type="text" value="This هو disabled" disabled="disabled">
<input type="text" value="This هو disabled" disabled="true">
<input type="text" value="This هو disabled" disabled="false">

وسوف كل ما سبق جعل مجال هذا الشكل "معطل".

ببساطة لا توفر السمة "معطل" تحافظ على حقل "ABLED" ... مثل أدناه

<input type="text" value="This ليس disabled" />

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

وهذا هو الفرق على الرغم عندما نستخدم هذه السمة في جافا سكريبت ...

document.form.element.disabled = صحيح؛ / سوف / يتم تعطيل العنصر
document.form.element.disabled = كاذبة؛ / سوف / يجب تمكين العنصر

الحجج المذكورة أعلاه ينطبق أيضا على هذه الصفات والعناصر:

• فحص (زر الراديو والاختيار)
• اختيار (الخيار)
• nowrap (TD)

هيريس آخر peice القليل من الخداع جافا سكريبت التي اضطررت الى حفر حولها لأن الوضع commaned ذلك. في واحد من مواقع ويب، وكان لي هذا الموقف حيث كان لي لتنفيذ "windows.onload" مرتين. أول شيء من شأنه أن وصل الى العقل عديم الخبرة مثل الألغام (أود أن أقول بصراحة أنه منذ لقد تم استخدام أطر جافا سكريبت والمكتبات، ولقد forgotton أن تفعل أشياء بسيطة في بلدي ... حزين الخاصة، ولكن صحيح)، هو الطريقة التالية ...

 window.onload = onloadfn1؛
 window.onload = onloadfn2؛
 window.onload = onloadfn3؛
 الخ ...

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

في الحالات العادية، على عكس الألغام (التي سأتحدث عنه قليلا في وقت لاحق) ... هل يمكن أن تفعل أحد الخيارات التالية لتنفيذ المهام onload mutliple ....

أو شيئا من هذا القبيل

 doOnLoad وظيفة () {
         onloadfn1 ()؛
         onloadfn2 ()؛
         onloadfn3 ()؛
 }
 window.onload = doOnLoad؛

عن وضعي الحالي، لا يمكنني استخدام أي من فوق ...
لماذا أحتاج إلى الاتصال مرتين windows.onload، بدلا من أن استدعاء اثنين من وظائف داخل دالة onload واحدة؟ هنا نظرة سريعة على بيان مشكلتي ...

"تمت هيكلة صفحات موقعي مثل هذا الموضوع وورد .... أي أن هناك Header.php المشتركة وFooter.php أن يحصل على وشملت في جميع صفحات الموقع. هناك وظيفة implementaion onload في Footer.php للقيام ببعض وظائف onload مشترك. وهناك بضع صفحات التي تحتاج إلى شيء من ONLOAD الخاصة بها، وبصرف النظر عن تلك التي قامت به وظيفة onload مشترك. إذا كنت تعيين وظيفة رد الاتصال مباشرة إلى معالج window.onload، وسوف الإفراط في ركوب الاسترجاعات تعيينه سابقا في Footer.php "

.... ومن المفهوم مشكلتي ؟

حسنا! هناك حلول عدة لأنني لم تجد. انها كلها متشابهة جدا وimplementions أساسا للحل الذي قدمته Willison سيمون ( http://simonwillison.net/2004/May/26/addLoadEvent/ ) ...

الحل:

ببساطة إضافة هذا الرمز جافا سكريبت لموقع ...

 وظيفة addLoadEvent (وظائفها) {
     فار oldonload = window.onload؛
     إذا كان (typeof window.onload! = 'الدالة') {
        window.onload = وظائفها
     } آخر {
        window.onload = وظيفة () {
            إذا كان (oldonload) {
                   oldonload ()
           }
           وظائفها ()
        }
    }
 }

والذي يطلق عليه بدلا من "windows.onload" المعتادة

 addLoadEvent (FunctionToRunOnPageLoad)؛
 addLoadEvent (وظيفة () {
 / * أكثر رمز لتشغيل على * تحميل الصفحة
 })؛ 

مزايا هذا مقتطف الشفرة ...
1. في المقام الأول، وهو يتيح لديك أحداث windows.onload متعددة، ودعا من أجزاء منفصلة من الشفرة الخاصة بك، دون overridding التعريف السابق
2. فمن غير مزعجة حقا. يمكن وضعها في ملف مع الكتابات الأخرى الخاصة بك أو في ملف منفصل.
3. كان يعمل حتى لو تم بالفعل تعيين window.onload.

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

جافاسكريبتس التحميل هو حيوي بسيطة ومباشرة جدا إلى الأمام على النحو التالي ...

= “text/javascript” > <نوع النصي = "نص / جافا سكريبت">
وظيفة loadNewScript (المصدر) {
فار ق = document.createElement ('السيناريو')؛
s.setAttribute ('نوع'، ​​'نص / جافا سكريبت')؛
s.setAttribute ('ضمني'، مصدر)؛
document.body.appendChild (ق)؛
}
</ SCRIPT>

ويمكن أن يكون لديك رابط المكالمة التالية في أي مكان في الجسم، أو هل يمكن أن يكون هذا السيناريو "onLoad" من الوثيقة نفسها ...

= “javascript:loadNewScript('myDynamicScript.js');” >Load Dynamic Script</ a > صفحة <a href = "جافا سكريبت: loadNewScript ('myDynamicScript.js')؛"> سكربت تحميل الحيوي </ أ>

أو

<body onload="loadNewScript('myDynamicScript.js')؛">

ليس هناك سوى عدد قليل من العلبة الخفيفة والتي يمكنك أن تجد عند البحث. وكانت هذه المسألة مع معظم lightboxes التي وجدت أنها بدت جميع لاستخدام واحد أو الآخر JAVASCRIPT الوزن الثقيل مثل أطر النموذج، مسج، MOOTOOLS ويحب. انهم جميعا بارد وفاخر تبحث. ولكن إذا كان الشرط الخاص بك هو "لكني أريد ان SCRIPT الاليكتروني بسيط وخفيف الوزن لموقعي"، ثم هنا هو؛

بعض ملامح لطيفة من هذه العلبة الخفيفة

1. خفيف جدا
   أ. 4KB من مخطوطات عندما معبأة (8 كيلوبايت مفتوح)
   ب. 2 ك من CSS
   ج. بعض أسطر HTML للحاوية الاليكتروني
2. بسيطة لفهم وتنفيذ
3. يمكن أن يكون Lightboxes متعددة على نفس الصفحة.
4. يتم استخدام الحاويات الاليكتروني نفسه لإظهار، والمحتوى المختلفة (والتي يتم تضمينها على حدة الانقسامات كما المخفية في الصفحة)، وهذا يتوقف على الرابط / الخيار الذي يتم النقر.
5. مراكز نفسه تلقائيا، مع الأخذ في الاعتبار جميع العوامل مثل ارتفاع النافذة والعرض (دقة الشاشة)، مبلغ صفحة التمرير وارتفاع محتويات العلبة الخفيفة
6. اختبرت في آي إي 7 و FF

عرض تجريبي |
تحميل الكود المصدر الاليكتروني (التحميل 1792 مرات)

jo.js، jo_pack.js [نسخة معبأة]: - مجموعة بسيطة من الأشياء جافا سكريبت [JO]، الذي يحتوي على العنصر، نافذة ومخطوطات وثيقة لتحديد المواقع. يمكنك فتح JO.JS إذا كنت ترغب في الحصول على أيديكم القذرة مع بعض Javascripting متقدمة، وخلق وظائف مجردة، وتمتد خصائص العناصر وتلك. إذا كنت لا أكثر من اللازم في Javascripting، تترك وحدها.

lightbox.js، lightbox_pack.js [نسخة معبأة]: - تحتوي على ضوء النصوص مدير مربع. إذا كنت مصمم الصفحة، ومسؤول أيضا مع تنفيذ صندوق الضوء على الصفحة، تحتاج إلى فهم LightBoxManager. LightBoxManager يحتوي أساسا مجرد وظيفتين showLightBox وcloseLightBox.

lightbox.css: - إذا كنت تعرف CSS، يمكن أن تقوم به في جميع أنحاء مع lightbox.css إلى تخصيص مظهر-N-يشعر lightbox.css

index.html و: تنفيذ عينة من صندوق الضوء مع اثنين من محتوى مختلف

lb_underlay_bkg.png: - وهذا هو الضوء / سيمي صورة شفافة يستخدم الخلفية لبطانة صندوق الصور [البطانة هي طبقة تحت lighbox، والذي يمنع المستخدم من النقر على أي كيان آخر في الصفحة، في حين أن العلبة الخفيفة مفتوحة]. يمكنك استخدام أي صورة أو حتى بلون واحد لهذا الغرض، وهذا يتوقف على تصميم صفحة ومتطلبات.

icon_lb_close.gif: - صورة عن وثيقة مقبض العلبة الخفيفة على اليمين أعلى مربع الضوء. ويمكن استخدام أي صورة وفقا للتصميم

عرض تجريبي |
تحميل الكود المصدر الاليكتروني (التحميل 1792 مرات)

واسمحوا لنا أن تعليقاتك وملاحظاتك ...

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

جافا سكريبت: document.body.contentEditable = 'صحيح'؛ document.designMode = 'على'؛ باطل 0

كثير من الأوقات نشعر بالحاجة إلى الكتابة الخارقة المتصفح specfic (رغم أنها ليست ممارسة جيدة، ونحن المطورين واجهة المستخدم تضطر الى اللجوء الى هذه الشرور حتى حروب المتصفحات الكبيرة تأتي الى هدنة). في وقت سابق، وكنت قد ذكرت في هذه المقالة للحصول على الكيانات المستقلة الخاصة بك فقط ، وكيفية كتابة قصاصة CSS التي من شأنها أن تكون واضحة للمتصفحات IE <IE7 فقط.

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

ضع <comment> فايرفوكس فقط HTML / CSS / مخطوطات هنا </ تعليق>

على سبيل المثال
<comment>
<style>
الأنماط * / * لفقط FF /
fieldset {الحدود: 1px # dddddd الصلبة؛}
</ النمط>
</ تعليق>

أنا "انا سعيد لحظة ...

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

Array.prototype. removeItem =function(str) {
for(i=0; i<this.length ; i++){
if(escape(this[i]).match(escape(str.trim()))){
this.splice(i, 1); break;
}
}
return this;
}


حتى الآن يمكنك أن تفعل شيئا من هذا القبيل ...

var animals= new Array("dog","lion","cat","tiger","elephant");
animals. removeItem ('tiger');

الآن فإن مجموعة الحيوانات تحتوي على "كلب"، "الأسد"، "القطة"، "الفيل"؛

ملاحظة: وهنا هو نموذج سلسلة تريم أيضا ...

String.prototype.trim=function(str) {
str = this != window? this : str;
return str.replace(/^\s+/g, '').replace(/\s+$/g, '');
}

استمتع ....

وتشمل لجافا سكريبت في أسفل المستند HTML

إذا لم يكن لديك document.write (أو أي جيل ديناميكي من محتويات الصفحة باستخدام جافاسكريبتس) لإدراج جزء من محتوى الصفحة في البرامج النصية، نقل سيناريو يتضمن البيان إلى أسفل الصفحة، قبل نهاية العلامة BODY.
مواصفات HTTP/1.1 تشير إلى أن برامج التصفح تحميل ما لا يزيد عن عنصرين في نفس الوقت لكل اسم المضيف. إذا كنت تستخدم الصور الخاصة بك من أسماء المضيفين متعددة، يمكنك الحصول على أكثر من عقدين من التنزيلات تحدث في نفس الوقت. في حين أن السيناريو هو تحميله، ومع ذلك، فإن المتصفح لا تبدأ أي تنزيلات أخرى، وحتى على أسماء المضيفين مختلفة.
وهناك أيضا وسائل لخلق ديناميكية العقد النصي وتحميل البرامج النصية البعيد بعد أن يتم تحميل الصفحة باستخدام أجاكس.

الخارجى كنت في جافا سكريبت

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

حقيبتك ملفات جافا سكريبت

في حالة من جافاسكريبتس، بخلاف CSS، يمكن مطحون الملفات باستخدام بعض الخوارزميات القياسية التي من شأنها أن تعطي حجم الملف المخفض من مجرد إزالة مسافات أو علامات التبويب. يمكن العثور على مثال باكر جافا سكريبت هنا http://dean.edwards.name/packer/

تخلص من أي مخطوطات مكررة

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

الحد من الوصول إلى عناصر DOM حيثما كان ذلك ممكنا

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

منفصلة سلوك من المضمون والعرض

تماما كما عرض منفصل (CSS / XSLT) من المحتوى (XHTML / XML)، ونحن يجب أن تفصل أيضا سلوك (جافا سكريبت). وهذا ما يسمى جافا سكريبت غير مزعجة. تماما كما ربط ملفات CSS الخارجية، ينبغي أن نربط إلى ملفات جافا سكريبت خارجي.

بدلا من الصعب الترميز السلوك في محتوى (مثل onmouseover، OnClick الخاص، وما إلى ذلك)، ينبغي سلوك حيوي إضافة إلى عناصر، والطبقات، وعناصر فريدة (معرفات) باستخدام DOM. ينبغي لهذه الوثيقة التأسيسية، والمحتوى، وتحتوي على الأقسام المختلفة صالحة فقط / XML وجافا سكريبت لا.
وينبغي أن جافا سكريبت زيادة محتوى عن طريق إضافة السلوك. ينبغي للمحتوى لا تزال مفيدة وصالحة للاستعمال بدون جافا سكريبت (أو من دون دعم جافا سكريبت كامل).

في مناسبات عدة، في حين تقوم تخطيطات الصفحات مع الانقسامات المنبثقة / lightboxes / نصائح الخ ونحن يأتي عبر الحالات التي يكون فيها بعض الكائنات نموذج SELECT يحدث أن تكون في إطار هذه الانقسامات POPUP، حسب التصميم وهذا يظهر من خلال .... يوك!

حسنا! هل يمكن بسهولة تحديد هذا عن طريق تعديل الخاص Z-INDEX القيم بشكل ملائم لFF و IE7. لكن جيد قديم (يقصد التورية) IE6 لا تتصرف على النحو المنشود .... وتظهر من خلال BOX SELECT، حتى بعد تطبيق بعض ارتفاع كبير Z-INDEX القيم إلى قسم الخاص قافزة ...! المشكله!

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

"إخفاء مربع SELECT ROUGE عند إظهار POPUP"

ببساطة قصاصة في السيناريو الخاص بك حيث كنت تظهر المنبثقة الخاص، إضافة إلى قطعة من سيناريو لتحديد الرؤية للصندوق SELECT إلى "المخفية"

document.getElementById ('my_select') style.visibilty = "الخفية".

وتذكر باعادته الى الوراء في ختام القسم الخاص قافزة

. document.getElementById ('my_select') style.visibilty = "مرئي"؛

حيث "my_select" هو معرف من صندوق تهيج SELECT

ويساعد هذا الأمل ...

PS. هناك خيارات أخرى مثل فكورسي positionining حيوي IFRAME (بنفس الحجم كما كنت قافزة) تحت DIV قافزة ... وهذا يعمل بشكل جيد جدا، ولكن مع إضافة الكثير من عناصر DOM، ومخطوطات، وصداع. ولقد استخدم هذا الحل أيضا، وإذا كنت لا تحتاج الى أي مساعدة مع هذا الخيار، لا اسمحوا لي أن أعرف. سوف نكون سعداء للمساعدة!