如何防止值四舍五入到javascript

wet*_*osh 2 javascript jquery

我有两个按钮,一个使得div(不同大小)的大小增加10倍,另一个使它们缩小10倍.按两次按钮使它们变小,div被舍入为零.无论您点击多少次使其变大,它都不会变大,因为它会将零值相乘.解决这个问题的标准方法是什么?这是必要的,因为在我的应用程序中,一些div比其他div大得多,所以当一个div小于一个像素宽(然后合理地看不见)时,其他div将是数千像素宽.

更新:我的div实际上是代表行星直径的圆圈.我需要这些确切的!如果我单击较小的按钮5次,我希望能够单击较大的按钮5次,并使其恢复到最初的确切直径.

而且,可能没有必要能够使div更小或更大无数次.限制它的标准方法是什么?请参阅我的jsfiddle,了解我想要实现的目标.http://jsfiddle.net/dfjosh/vtxeD/12/

HTML

<a href="javascript:;" class="smaller">smaller</a>
<a href="javascript:;" class="larger">larger</a>
<div></div>
Run Code Online (Sandbox Code Playgroud)

CSS

div {
    width: 50px;
    height: 50px;
    background: cornflowerblue;
}
Run Code Online (Sandbox Code Playgroud)

JavaScript的

$('a').click(function() {
    if($(this).hasClass('smaller')) {
        var element = $('div');
        element.animate({
            'width' : element.width() * 0.1,
            'height' : element.height() * 0.1
        });
    } else if($(this).hasClass('larger')) {
        var element = $('div');
        element.animate({
            'width' : element.width() * 10,
            'height' : element.height() * 10
        });
    }
});
Run Code Online (Sandbox Code Playgroud)

Dav*_*mas 6

鉴于0评估为'falsey'(或false-ish),您可以使用||运算符传递或返回1的事件:width()height()0

var element = $('div');
element.animate({
    'width' : (element.width() || 1) * 10,
    'height' : (element.height() || 1) * 10
});
Run Code Online (Sandbox Code Playgroud)

JS小提琴演示.