我构建了一个页面，它使用一个简单的 JSon 表和 JS/JQ 来呈现该数据。一起托管在一张纸上，它在 Chrome 和 FF 中都可以正常工作。拆分成单独的 HTML、CSS、JS 和 JSON 文件，但是，Chrome 中存在一个稍微可变的错误。
页面：http ://www.lafairclough.co.uk/JTest/index.html
从下拉列表中选择两个选项，右侧的图表应显示两辆车的相对性能数据（从上到下：0-60、0-100、Standing Qtr 和 Top Speed）。这些是颜色编码的，绿色是更快的结果，橙色表示给定变量的平局。
这些图表是使用 Java 来计算和设置 CSS div 宽度的。然而，在 Chrome 中，这个 div 宽度（有时，但经常）被计算为比预期高得多的数字。随着流动：
// Perf. BAR CHART SIZE CSS CAR A
$.getJSON("cars.json", function (data) {
$(document).ready(function () {
$('#dropdown1').change(function () {
var index = parseInt($(this).val()),
html = "<p class=\"barText\">" + " " + data.carList[index].model + " " + data.carList[index].variant + "</p>";
$(".carA060").html(html);
var index = parseInt($(this).val());
var num = data.carList[index].zero60 * 10;
$(".carA060").css('width', num + '%').show();
html = "<p class=\"barText\">" + " " + data.carList[index].model + " " + data.carList[index].variant + "</p>";
$(".carA0100").html(html);
var index = parseInt($(this).val());
var num = data.carList[index].zero100 * 5;
$(".carA0100").css('width', num + '%').show();
html = "<p class=\"barText\">" + " " + data.carList[index].model + " " + data.carList[index].variant + "</p>";
$(".carAsQTR").html(html);
var index = parseInt($(this).val());
var num = data.carList[index].sQTR * 5;
$(".carAsQTR").css('width', num + '%').show();
html = "<p class=\"barText\">" + " " + data.carList[index].model + " " + data.carList[index].variant + "</p>";
$(".carAvMAX").html(html);
var index = parseInt($(this).val());
var num = data.carList[index].vMAX * 0.5;
$(".carAvMAX").css('width', num + '%').show();
});
});
});
任何关于为什么它在 Chrome 中出错的想法都将不胜感激。
谢谢，
李。