CSS类只应用于一个元素

css class applied only on one element

本文关键字:一个 元素 应用于 CSS      更新时间:2023-09-26

每2秒我的js函数被触发,经过一定的逻辑,我想在页面上的html元素上应用css类的效果。

   var myCounter= 0;        
    $interval(function () {            
        myCounter++;
        DoSomething();
        $('#myElem_' + myCounter).addClass('myClass');
    }, 2000);
    function DoSomething() {
        if (myCounter<= 35) {                
            if (myCounter == 0) {
                $scope.myIndex= 1;
            } else {
                $scope.myIndex= myCounter;                   
            }
        } else {
            // not implemented
        }
    }
HTML页面上的

CSS类只在第一次应用。Counter可以工作,但是css只能应用于第一个元素。

在HTML页面上,HTML元素上有唯一的id号,比如

<div id="myElem_1"></div>
<div id="myElem_2"></div>

您的代码看起来非常好。请注意,第一个元素在2秒后获得类,然后在另一个 2秒后,第二个元素获得类。

所以你必须等待总共4秒才能看到所有的变化。

在所有更改之后,您需要在函数中使用$scope.$apply();:

function DoSomething() {
    if (myCounter<= 35) {                
        if (myCounter == 0) {
            $scope.myIndex= 1;
        } else {
            $scope.myIndex= myCounter;                   
        }
    } else {
        // not implemented
    }
    $scope.$apply(); // <---put this one here.
}

我猜你正在更改/更新上面函数中的一些作用域变量,所以你需要告诉angular检查更改并更新作用域。