Jquery 将加法符号混淆为串联

我有两个按钮可以上下移动一个框，JQuery用于获取CSS“top”值，该值可以被添加到或减去。从中减去时，它会按预期工作，但添加到中时则不会

这似乎是一种将加法符号与串联符号混淆的情况。然后在添加的数字周围加上一些括号，但这没有什么区别

执行减法时的工作代码如下所示：

$('#dir_panel_form').css({
    'top': $('#dir_panel_form').css('top').substring(0, $('#dir_panel_form').css('top').length - 2) - 30 + 'px'
}); 

($('#dir_panel_form').css('top').substring(0, $('#dir_panel_form').css('top').length - 2) + 30)

下面显示了非工作代码，即发生添加时的代码，并用粗体显示了一组额外的括号：

$('#dir_panel_form').css({
    'top': ($('#dir_panel_form').css('top').substring(0, $('#dir_panel_form').css('top').length - 2) + 30) + 'px'
}); 

下面还显示了带有额外括号（再次加粗）的代码段：

$('#dir_panel_form').css({
    'top': $('#dir_panel_form').css('top').substring(0, $('#dir_panel_form').css('top').length - 2) - 30 + 'px'
}); 

($('#dir_panel_form').css('top').substring(0, $('#dir_panel_form').css('top').length - 2) + 30)

---

有人能找到这个吗？

这个问题是因为

子字符串

返回一个字符串。因此，下面的

+

运算符成为一个串联而不是加法。您需要使用

parseInt（）

将字符串转换为整数

$('#dir_panel_form').css({
    'top': parseInt($('#dir_panel_form').css('top').substring(0, $('#dir_panel_form').css('top').length - 2), 10) + 30 + 'px'
}); 

还请注意，您可以通过使用较短的

切片（0，-2）

从字符串中删除最后两个字符，并为

css（）

方法提供一个函数来进一步改进这一点。这将提高性能，因为只有一个对DOM的请求，而不是三个

$('#dir_panel_form').css('top', function(i, top) {
    return parseInt(top.substring(0, -2), 10) + 30 + 'px'
}); 

---

尝试使用

parseInt

而不是

substring

函数，因此替换

($('#dir_panel_form').css('top').substring(0, $('#dir_panel_form').css('top').length - 2) + 30) + 'px'

到

---

可能是《谢谢你》的翻版——它很有效。您可能已经猜到substring（）是用来去掉“px”的，但是parseInt（）似乎是这样做的——非常简单。