ركوب الدراجات من خلال ألوان الخلفية مع جافا سكريبت

Question

يمكن لأحد أن يقول لي لماذا البرمجية التالية قد لا دورة من خلال مجموعة من الألوان المحددة هنا:

var colors = ["white", "yellow", "orange", "red"];

و هنا هو سطر من التعليمات البرمجية في السؤال:

setInterval(function(){
          currElm.style.background = colors[(nextColor++)%(colors.length)]);
      }, 500);

يبدو أن هذا يجب أن تعمل و رأيت عدة أمثلة التعليمات البرمجية مثل هذا المنتجة لون الدراجات تأثير.لا ترى أي مشكلة مع أعلى (أو أقل) رمز ؟

وظيفة كاملة(التقدم في العمل):

function setHighlight(elmId, index, songLength){
//alert("called set highlight, params are " + elmId + " " + index + " " + songLength);
var colors = ["white", "yellow", "orange", "red"];
var nextColor = 0;
if(index < 10)
    index = "000" + (index);
  else if (index < 100)
    index = "000" + (index);
  else if(index < 1000)
    index = "0" + (index);
  if(index >= 1000)
    index = index;
//alert("called set highlight, params are " + elmId + " " + index + " " + songLength);

//this will be useful for finding the element but pulsate will not work, need to       research animations in javascript

var mainElm = document.getElementById('active_playlist');
var elmIndex = "";

for(var currElm = mainElm.firstChild; currElm !== null; currElm = currElm.nextSibling){
  if(currElm.nodeType === 1){

  var elementId = currElm.getAttribute("id");

  if(elementId.match(/\b\d{4}/)){

    elmIndex = elementId.substr(0,4);
    alert(currElm.getAttribute('id'));

    if(elmIndex == index){
        setInterval(function(){
          currElm.style.background = colors[(nextColor++)%(colors.length)]);
      }, 500);
    }
  }
}
}//end for

}

كل مساعدة هو موضع تقدير كبير.شكرا

Answer 1

بضعة أشياء مختلفة.أولا يبدو أنك مطابقة العناصر التي تحتوي على معرفات مساحة تليها 4 أرقام.أنا لا أعتقد أن المساحات المسموح بها في معرفات.أود حقا أن نرى HTML العناصر التي يجب أن تكون مطابقة.ثانيا أعتقد أنك ترغب في تعيين currElm إلى متغير جديد أنه سيتم القبض عليه في setInterval معالج.إذا كنت لا أعتقد أنه يمكن دائما الرجوع إلى العنصر الأخير يقابل بدلا من كل عنصر مطابقة.

for(var currElm = mainElm.firstChild; currElm !== null; currElm = currElm.nextSibling){

  if(currElm.nodeType === 1){

    var elementId = currElm.getAttribute("id");

    if(elementId.match(/\b\d{4}/)){

      elmIndex = elementId.substr(0,4);
      alert(currElm.getAttribute('id'));

      if(elmIndex == index){
          var that = currElm;
          setInterval(function(){
              that.style.background = colors[(nextColor++)%(colors.length)];
          }, 500);
      }
    }
  }

}//end for

تحرير أيضا إصلاح إضافية قوسين في الفترة معالج.

Answer 2

خطأ في بناء الجملة، خارج الحق ')' قوسين في نهاية السطر:

currElm.style.background = colors[(nextColor++)%(colors.length)]);

Answer 3

وأرى قوس أيمن اضافية كذلك!

ولكن المتغير nextColor تتم تهيئة بالفعل إلى الصفر، مباشرة بعد مجموعة الألوان.

وهذه هي وظيفة للالحرائق. يمكنك تعيين نقطة توقف اليمين قبل ان تحصل على دعوة setInterval، واختبار مختلف المتغيرات التي هي في وظيفة setInterval في المجهول.