Question

我无法根据不同元素的宽度动态调整宽度。所以我做了一小段javascript来解决这个问题对我来说，这是一个实验，但一个奇怪的问题引起了我的注意..

var adjustTo = $(this).attr('data-adjust-width-to'),
    totalWidth = $(this).parent().width(),
    targetWidth = $(this).parent().find(adjustTo).width(),
    newWidth = totalWidth - targetWidth;

$(this).width(newWidth);

这在firefox，safari甚至IE7中运行得很好。但是，当我在Chrome中使用它时，它声称targetWidth为0，即使它不是在我使用控制台检查它正在调用的元素时。

我设法修复它......把整个东西放在一个带有0延迟的setTimeout ......

我认为它与渲染没有完成有关，但由于代码放在document.ready（）函数中......不应该是这样，对吧？

谁知道造成这个问题的原因是什么？

Answer 1

不常见，但尝试拆分var来电：

var adjustTo = $(this).attr('data-adjust-width-to');
var totalWidth = $(this).parent().width();
var targetWidth = $(this).parent().find(adjustTo).width();
var newWidth = totalWidth - targetWidth;

$(this).width(newWidth);

Answer 2

怎么样：

var adjustTo = $(this).attr('data-adjust-width-to'),
    totalWidth = $(this).parent().width(),
    targetWidth = $(this).parent().find('#' + adjustTo).width(),
    newWidth = totalWidth - targetWidth;

$(this).width(newWidth);

我猜adjustTo是一个指向某个元素的ID。虽然IE并不真正关心#，但WebKit（Chrome）确实如此。

奇怪的jQuery + Chrome问题

2 个答案: