0

これはJSfiddleへのリンクです。

Javascript:

var headerCount;
var timeDelay;
$(document).ready(function () {
  headerCount = $('.headerlink').length;
  timeDelay = $('.current').attr('ref');
  if (undefined != timeDelay) {
    timeDelay = "5000"
  }
  setTimeout("advance()", timeDelay);
});

function advance() {
  $('.current').next('.headerlink').addClass('current2');
  $('.current').removeClass("current");
  $('.current2').addClass('current').removeClass('current2');
  if (headerCount == $(".current").index('.headerlink')) {
    $('.current').removeClass('current');
    $('.headerlink:nth-child(1)').addClass('current');
  }
  timeDelay = $('.current').attr('ref');
  if (undefined != timeDelay) {
    timeDelay = "5000"
  }
  setTimeout("advance()", timeDelay);
}​

HTML:

<a ref="5000" class="headerlink current" href="http://www.raceramps.com/12-4thqtr-twenty-five-dollar-rebate.aspx"> <img class="headerimg" src="http://www.raceramps.com/images/promos/4thQTR[25_rebateCheck].jpg" /> </a>

<a class="headerlink" href="http://www.raceramps.com/2012-3rdqtr-25-visa.aspx"> <img class="headerimg" src="http://www.raceramps.com/images/promos/3rdQTR[25VISA_rebate].jpg" /> </a>

<a class="headerlink" href="http://www.raceramps.com/12-4thqtr-twenty-five-dollar-rebate.aspx"> <img class="headerimg" src="http://www.raceramps.com/images/promos/4thQTR[25_rebateCheck].jpg" /> </a>

<a class="headerlink" href="http://www.raceramps.com/12-4thqtr-twenty-five-dollar-rebate.aspx"> <img class="headerimg" src="http://www.raceramps.com/images/promos/4thQTR[25_rebateCheck].jpg" /> </a>

問題:目標は、コードを に追加.currentし、元のコードからnext('.headerlink')削除する.currentことです。しかし、何らかの理由で、削除するだけです.current(一致するすべての要素を非常に迅速に追加/削除するように見えます)。

私は何が欠けていますか？</p>

4

2 に答える 2

0

私はあなたが持っているつもりだったと信じています：

undefined == timeDelay

ではありません!=。

すぐに実行するundefined期間として渡しています。setTimeout

また、コードを簡素化し、current2すべてをまとめて行う必要をなくすこともできます。 

var $current = $('.current');
var $newCurrent = $current.next('.headerlink').addClass('current');

$current.removeClass('current'); // This still only has the first element even though you added .current to another

秘訣は、変数$currentには、作成時にセレクターに一致した要素が含まれていることです。DOM に対するその後の変更は、 内の一致する要素のセットには影響しません$current。

ここにいくつかの追加のクリーンアップを含む完全な例

于 2012-10-11T17:37:47.977 に答える
0

これは仕事をします：

http://jsfiddle.net/carlosmartinezt/Erw8y/29/

コードは次のとおりです。

$(document).ready(function () {
  setTimeout("advance()", $('.current').attr('ref') || 1000);
});

function advance() {
  var nextHeaderLink = $('.current').removeClass("current").next('.headerlink');

  if( nextHeaderLink.length == 0 )
      nextHeaderLink = $('.headerlink:first-child');

  nextHeaderLink.addClass('current');

  setTimeout("advance()", nextHeaderLink.attr('ref') || 1000);
}​

これは単純化されたバージョンであり、無関係なコード行が削除されています。

于 2012-10-11T17:44:07.240 に答える