Question

我的网页中有一个表单，它将信息提交给外部应用程序，并根据来自＆＃34; display：none＆＃34;的响应更改元素的样式。 to＆＃34; display：block＆＃34;。

我希望能够在完成更改后运行一个函数，因为它表明操作成功。

你会怎么做这件事？

Answer 1

这是一种快速而肮脏的方式：

var onElementStyleChange = (function() {
  var elements = [],
      started = false;
  return function(element, callback) {
    elements.unshift({element: element, callback: callback});
    if (!started) {
      window.setTimeout(function checkElements() {
        for (var i = elements.length - 1; i >= 0; i--) {
          var element = elements[i].element,
              callback = elements[i].callback;
          if (element.style.display === 'block') {
            callback();
            elements.splice(i,1);
          }
        }
        if (elements.length) {
          window.setTimeout(checkElements, 0);
        } else {
          started = false;
        }
      },0);
      started = true;
    }      
  }
}());

然后你可以调用它来检查你的元素：

onElementStyleChange(element, function() {
  //do stuff..
});

说明：onElementStyleChange一遍又一遍地检查您的元素，并且在元素的display样式属性为block之前不会停止检查。一旦它看到你的元素有display: block，它就会调用你传递给它的任何函数并停止检查。

编辑：已更新，以便任意数量的元素都可以使用此功能。

聆听使用jQuery通过外部应用程序对元素进行的样式更改

1 个答案: