在获取元素的边框宽度之前,如何确保添加类?

时间:2013-07-15 17:13:54

标签: javascript jquery

似乎当我使用jQuery的addClass函数添加一个带有2px边框的类时,它会在iframe中输出css时有时返回旧值而不是new。我认为这种情况有时只是因为类的添加速度有多快。例如:

样式表:

.testBorder {
   border: 2px solid #000;
}

JavaScript的:

var iframe = $('#contentFrame').contents();
var obj = $('#someObj',iframe);
obj.addClass('testBorder');
console.log(obj.css('border-top-width')); 
console.log(obj.css('border-left-width'));

输出的边界值通常为0而不是2px。我可以这样做:

obj.delay(500).queue(function(){
   console.log($(this).css('border-top-width')); 
   console.log($(this).css('border-left-width'));
   $(this).dequeue();
});

但是在添加类之后立即应用它,因为我使用正确的值来定位它看起来不像它的跳跃。

CSS正在被应用并被反映出来,所以我知道它正在更新,而不是被其他样式覆盖。

我使用的jQuery版本是1.10.2和jQuery Migrate v1.2.1,我正在使用jQuery UI。

1 个答案:

答案 0 :(得分:0)

试试这个:

var iframe_content = ($.browser.msie ? $('#contentFrame').get(0).contentWindow.document) : $('#contentFrame').get(0).contentDocument));
var obj = iframe_content.find('#someObj');
obj.queue(function() { /** check for border width here **/ });
obj.addClass('testBorder').dequeue(); /* this last .dequeue() may not be necessary */