简体   繁体   English

防止jQuery在$ .Animate()中使用科学计数法?

[英]Preventing jQuery from using Scientific Notation in $.Animate()?

How am I able to prevent jQuery from using scientific notation - 1.2e+07 instead of 12,000,000 within the jQuery.animate() function? 如何防止jQuery使用科学记数法-jQuery.animate ()函数中的1.2e + 07而不是12,000,000

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


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

Desired results: background-position-x: 12000000px; 预期结果: background-position-x: 12000000px;

在此处输入图片说明

This starts occuring as soon as the number hits 1 million (1,000,000): 一旦数字达到一百万(1,000,000),就会开始发生这种情况:

在此处输入图片说明

This, in turn, causes my application to behave strangely. 反过来,这导致我的应用程序表现异常。 I want pure, simple integer numbers -- none of this scientific nonsense! 我想要纯净,简单的整数-这些科学废话都不是! I've looked around but I cannot find anything related to the jQuery library. 我环顾四周,但找不到与jQuery库相关的任何内容。 Only pure JS functions. 仅纯JS函数。

Note 1: It's not just animate, but $.css() as well. 注意1:不仅是动画,而且还有$ .css()。 I assume other jQuery functions are similar also. 我假设其他jQuery函数也相似。

Note 2: I don't think it's the browser that does it because if I enter the value in manually it works just fine until you hit the usual max 32 bit integer 注意2:我认为浏览器无法做到这一点,因为如果我手动输入该值,那么在您达到通常的最大32位整数之前,它都可以正常工作


Why is this a problem: 为什么这是个问题:

12000321 converts to: 1.20003e+07 12000321转换为: 1.20003e + 07

When I then convert 1.20003e+07 back to an integer I get: 12000300 然后将1.20003e + 07转换回整数时,我得到: 12000300

When you get to Scientific Notation, the step size is in the 100s & not 1s and not specific enough. 当您到达“科学计数法”时,步长为100s而不是1s,并且不够具体。


Thank you for considering my question 谢谢你考虑我的问题

Wow... took me a long time but I finally managed to work out a way of doing this. 哇...花了我很长时间,但我终于设法找到一种方法。

After lots of testing I noticed that passing a direct string to $.attr() did not convert the numbers to the scientific notation. 经过大量测试,我注意到将直接字符串传递给$ .attr()并没有将数字转换为科学计数法。

I created a custom animation and manually set the style attribute as a string. 我创建了一个自定义动画,然后将style属性手动设置为字符串。

Seems to be working & going up in single digits not 100s!! 似乎可以正常工作并以一位数而不是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();
    }
});

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM