Question

我一直在研究检测属性值何时变为等于特定值的方法。 MutationObserver似乎只表示属性值已更改，而不是检查是否已更改并且等于特定值。

我有一个运行setTimeout为200ms的click事件来调用径向进度指示器的函数。在click和setTimeout之后，指示符的HTML属性值从0到100计数。完成后，HTML如下：

<div class="radial-progress" data-progress="100">

有什么方法可以在时启动其他功能或运行其他代码，只有在数据进度== 100时<？p>

这是脚本：

$("#someID").on("click", function(event){
     event.preventDefault();

     // Load-progress counter //
     window.loadProgress = function() {
          $('.loadProgress .radial-progress').attr('data-progress', Math.floor(1 * 100));
     }
     setTimeout(window.loadProgress, 200);

     // Run some other code when data-progress == 100
});

Answer 1

你可以通过向div添加一些任意样式来使用一种解决方法，一些不会影响其外观的样式。在data-progress="100"

时仅指定此样式

div.radial-progress[data-progress="100"] {
  some-style:whatever;
}

然后使用MutationObserver来监控样式更改。

是否有可能检测到属性值何时更改为等于特定值，而不仅仅是检测到它已更改？

1 个答案: