适用于chrome但不适用于firefox - jquery

【问题标题】：works in chrome but not firefox - jquery适用于chrome但不适用于firefox - jquery
【发布时间】：2011-08-21 22:12:32
【问题描述】：

 $('#carat_weight_right li').css('left', function(index, value) {
   if (value === '100%') {

        $(this).children('span').css({'margin-left': '-58px', 'text-align': 'right'});
        alert('hello');

    }
 });

似乎在 chrome 中工作，但在 firefox 中没有任何人有线索吗？？？？

谢谢

【问题讨论】：

firebug 能告诉你什么吗？
有演示页面可以看看吗？这还不够。
实际发生了什么？它是否完全爆炸并且您从未收到警报？您是否收到警报但没有任何反应？你得到警报和坏事发生了吗？等
什么不起作用？警报还会出现吗？
没有任何警报。 ...演示页面位于arc-max.com/menuinsert/diamondsearch/diamond.php

标签： jquery firefox google-chrome cross-browser

【解决方案1】：

这是一个有趣的跨浏览器实现差异的案例。

Firefox 正在为元素的computed style 返回used value。这最终是用于在浏览器中呈现元素的实际像素值：Firefox 看到 100%，在您的布局中决定真正等同于 326 像素，并返回 326 像素。 Mozilla talks about their implementation here.

另一方面，Chrome 会为 computed style 返回 specified value（“100%”）。

W3C 说两者都是有效的：returning the specified value is fine 如果可以在不需要布局文档的情况下完成； returning the used value is OK 如果该值只能在布局完成后确定。

那你该怎么办？找到一种不同的方法来进行计算。 :-) 也许检查一下你的元素的position().left 是否大于或等于它的偏移父元素的width()？

【讨论】：