1

内でクラスを追加および削除しようとし<span>ていますが、関数が呼び出されているにもかかわらず removeClass が機能しません。 

setInterval(changeClass,4000);

var spanId=1;

function changeClass(){
 $('#'+spanId).addClass("hilite");
 setTimeout(remove, 1000);
 spanId++;}  

function remove(){
 $('#'+spanId).removeClass("hilite");
  return true;
  }

誰でも理由を教えてもらえますか？

このようなwhileループでこれを行うにはどうすればよいですか

var spanSet=4;
var spanId=1;
while(spanSet > 0)
{
changeClass();
spanSet--;
}

function changeClass(){
$('#'+spanId).addClass("hilite");
setTimeout(remove, 3000);
}

function remove(){
$('#'+spanId).removeClass("hilite");
spanId++;
return true;
}
4

4 に答える 4

5

spanIdタイムアウトが終了する前にインクリメントされているため、最後のアイテムではなく次のアイテムからクラスを削除しようとしています。

この問題を回避する通常の方法は、クロージャーを使用することですが、この場合、関数spanId++;の最後に移動する方がはるかに簡単です。remove

クロージャー アプローチ (この場合は、単にインクリメントを移動するのに比べて複雑すぎるため、お勧めしません) は次のようになります。

setInterval(changeClass, 4000);
var spanId = 1;

function changeClass() {
    $('#' + spanId).addClass("hilite");
    setTimeout(
        remove(spanId), // CALL remove and pass spanId as an argument
        1000
    );
    spanId++;
}

function remove(spanId) {
    return function () { // RETURN a function from remove().
        // Note: This spanId is the local variable defined in the argument list
        //       not the one that exists in the wider scope
        $('#' + spanId).removeClass("hilite");
        return true;
    }
}
于 2012-07-22T12:34:07.037 に答える
2

あなたはそれをそのように置くべきです：

setInterval(changeClass, 4000);
var spanId = 1;

function changeClass() {
    $('#'+spanId).addClass("hilite");
    setTimeout(remove, 1000);
}  

function remove() {
    $('#'+spanId).removeClass("hilite");
    spanId++;  // <--
    return true;
}

編集：[Quentinがdiffツールの使用を提案しているため、Quentinに感謝します]

呼び出しごとに同じ値の spanId で changeClass 関数と remove 関数の両方が呼び出されるように、remove 関数の最後に spanId++ を配置しました。

于 2012-07-22T12:35:59.347 に答える
-1 
function changeClass(){
 $('#'+spanId).addClass("hilite");
 setTimeout(remove, 1000);
 spanId++;}

spanId++このコードでは、setTimeout ステートメントが終了するまで JS は実行を停止しないため、setTimeout にパラメーターとして渡されるコールバック関数で実行する必要があります。

したがって、コードは次のようになります。

function changeClass(){
 $('#'+spanId).addClass("hilite");
 setTimeout(remove, 1000);
}  

function remove(){
  $('#'+spanId).removeClass("hilite");
  spanId++;
  return true;
}
于 2012-07-22T12:36:12.327 に答える
-2

これは私にとってはうまくいき、タイムアウト制御も追加します。

changeClass();

function changeClass(){
    $("#container").addClass("box");
    console.log("changeClass()");
    clearTimeout(interval);
    interval = setTimeout(remove, 1000);
}

function remove(){
    $("#container").removeClass("box");
    console.log("remove()");
    clearTimeout(interval);
    interval = setInterval(changeClass,1000);
}
于 2012-07-22T12:40:47.817 に答える