防止 jQuery 在 $.Animate() 中使用科学记数法？答案

【问题标题】：Preventing jQuery from using Scientific Notation in $.Animate()?防止 jQuery 在 $.Animate() 中使用科学记数法？
【发布时间】：2023-03-07 06:51:01
【问题描述】：

如何防止 jQuery 在 jQuery.animate() 函数中使用科学记数法 - 1.2e+07 而不是 12,000,000？

使用： $('body').css({ backgroundPositionX: 12000000 + 'px' });

转换为： background-position-x: 1.2e+07px;

想要的结果： background-position-x: 12000000px;

一旦数量达到 100 万 (1,000,000)，就会开始发生这种情况：

这反过来又导致我的应用程序行为异常。我想要纯粹的、简单的整数——没有这些科学的废话！我环顾四周，但找不到与 jQuery 库相关的任何内容。只有纯 JS 函数。

注意 1：它不仅仅是动画，还有 $.css() 。我假设其他 jQuery 函数也类似。

注意 2：我不认为是浏览器做的，因为如果我手动输入值，它会正常工作，直到你达到通常的最大 32 位整数

为什么会出现这个问题：

12000321 转换为：1.20003e+07

当我将 1.20003e+07 转换回整数时，我得到：12000300

当您使用科学记数法时，步长是 100 秒而不是 1 秒，而且不够具体。

感谢您考虑我的问题

【问题讨论】：

标签： javascript jquery notation

【解决方案1】：

哇...花了我很长时间，但我终于想出了一个办法。

经过大量测试后，我注意到将直接字符串传递给 $.attr() 并没有将数字转换为科学记数法。

我创建了一个自定义动画并手动将样式属性设置为字符串。

似乎正在工作并以个位数而不是 100s 上升！！

$({
    x: this.x,
    y: this.y
}).animate({
    x: x,
    y: y
}, {
    easing: this.motion_type,
    duration: this.duration,
    step: function(now, fx) {

        var current_styles = $('.area').attr('style'),
            current_styles = string = current_styles.split(" ");

        var x = parseFloat(current_styles[1].replace('px', '').replace(';', ''));
        var y = parseFloat(current_styles[2].replace('px', '').replace(';', ''));

        if ('x' === fx.prop) {
            x = now;
        } else if ('y' === fx.prop) {
            y = now;
        }

        $('.area').attr({ style: 'background-position: ' + x + 'px ' + y + 'px;' });

    },
    complete: function() {
        t.stopNow();
    }
});

【讨论】：