javascript – AngularJS / jQuery:更改span中的文本不会触发resize事件

前端之家收集整理的这篇文章主要介绍了javascript – AngularJS / jQuery:更改span中的文本不会触发resize事件前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
在我更改了跨度内的文本后,我无法在跨度上触发jQuery的resize事件.

我正在使用AngularJS指令将事件处理程序应用于span元素:

angular.module("test.directives",[])
    .directive("trackSize",["$parse",function($parse) {
        return function(scope,element,attrs) {
            function callback() {
                var size = { w: element.width(),h: element.height() };
                scope[attrs.trackSize].call(scope,size);
            }
            element.on("resize",function() {
                console.log("resize");
                scope.$apply(callback);
            });
            callback();
        };
    }]);

但是当跨度内的文本发生变化时,我没有看到回调激发.如果相关:使用嵌入的AngularJS表达式更改文本.

我的实际(完整)代码片段可以在jsFiddle上看到:http://jsfiddle.net/KkctU/13/

解决方法

resize事件不适用于文档中的元素,如span.它只能在窗户上使用.

Here is a plugin that might help you.我没有使用它,但它似乎正好适合你.

但是,最后,在指令中设置一个监视器可能更好/更容易,无论绑定到它的任何东西,然后检查文本更改时高度和宽度是否已更改.就像一个想法:

app.directive('trackSize',function () {
   return function(scope,attrs) {
       var w = element.width(),h = element.height();
       scope.$watch(attrs.trackSize,function(v) {
           element.text(v);
           var w2 = element.width(),h2 = element.height();
           if(w != w2 || h != h2) {
              //TODO: do something here,the size has changed.
           }           
       });
   }
});

猜你在找的jQuery相关文章