Question

我发誓这应该有效，但事实并非如此。我必须遗漏一些简单的事情：

HTML：

<div id="box"></div>

CSS：

#box {
    position: absolute;
    background: blue;
    width: 200px;
    height: 200px;
    left: 20px;
    top: 20px;
}

JavaScript的：

$('#box').click(function(e) {
    if (e.shiftKey)
        $(this).css('left', '70px');
    else
        $(this).css('left', '+=50');
});

如果你移动+点击，框就会移动。尝试点击不移动，并且框不会将其左边缘位置增加50px。是什么给了什么？

Answer 1

请参阅http://bugs.jquery.com/ticket/9237

该错误将在1.6.2修复。

破碎：http://jsfiddle.net/Kwpuq/

修正：http://jsfiddle.net/Kwpuq/1/ - 正在使用“jQuery（edge）”

Answer 2

$('#_testList').css('left', (parseFloat($('#_testList').css('left')) + 10) + 'px');

这将得到字符串的数字部分 - 在这种情况下，它获得10px中的10 - 增加10，然后追加'px'。在css中，您必须在值的末尾具有度量单位。

希望这有帮助！

Answer 3

我的解决方案可能如下：

$('#box').click(function(e) {
    if (e.shiftKey)
        $(this).css('left', '70px');
    else {
       var left = parseInt($(this).css('left'));
        left+=50;
        $(this).css('left',left)}
});

演示： http://jsfiddle.net/JYAqr/

$(this).css('left')返回一个字符串，因此您必须将其删除为整数，然后再添加50px

Answer 4

更改：

$(this).css('left', '+=50');

到：

$(this).css('left', '+=50px');

增量CSS定位不起作用

4 个答案: