jquery - jQuery .position()是否可以获取calc()值而不是px值？

我有一个按钮，可将div的大小从200px-290px调整为

在此div中，存在使用calc(50% - 25px);定位的元素
25px = half width of child-因此它们位于中央。

我正在使用jQuery的ui.swappable交换元素，但是您遇到的问题是，一旦交换，它们似乎将永久承担其计算值

交换前left:calc(50% - 25px);
交换后left:74px

有没有办法交换calc（50％-25px）;而不是值后计算？

$(this).position()

最佳答案

解决了这个。

而不是交换元素的位置，我使用以下内容从可拖动的droppable div中提取子html，然后将其附加到其各自的div中，从而保持calc（）值。

$( ".ClassofSwappableElement" ).draggable({
    stack: ".ClassofSwappableElement",
    distance: 0,
    revert: "invalid",
    opacity: 0.5,
    helper: "clone"
});

$( ".ClassofSwappableElement" ).droppable({
    accept: ".ClassofSwappableElement",
    drop: function( evt, ui ) {

var draggable = ui.draggable,
    draggablebgc = ui.draggable.children().css('background-color'),
    draggablevalue = ui.draggable.attr('value'),
    droppable = $(this),
    droppablebgc = $(this).children().css('backgroundColor'),
    droppablevalue = $(this).attr('value');

draggable.attr('value', droppablevalue );
droppable.children('.ClassofChildYouWanttoChangeBgColorof').css({ backgroundColor: draggablebgc });
droppable.attr('value', draggablevalue );
draggable.children('.ClassofChildYouWanttoChangeBgColorof').css({ backgroundColor: droppablebgc });

var drophtml = droppable.html(),
    draghtml = draggable.html();

droppable.empty();
draggable.empty();
droppable.append(draghtml);
draggable.append(drophtml);

注意：需要jQueryUI