如何刪除可排序的樣式屬性？

我在頁面上有兩個列表，可能會在它們之間拖動項目。我使用jQuery-UI可以對這個功能進行排序。然而，jQuery添加到項目的樣式屬性會干擾邊框的樣式。我試圖刪除drop回調中的樣式屬性，但它似乎太早觸發，並且在調用removeStyle後可排序添加樣式屬性。如何刪除可排序的樣式屬性？

如何確保在排序完成移動項目以便正確的邊框樣式顯示後刪除style屬性？

$(document).ready(function(){ 

    function removeStyle(e, ui) { 
    var item = $(ui.draggable) 
    item.removeAttr('style') 
    } 

    $('.drawer, .list').disableSelection(); 
    $('.drawer').sortable({ connectWith: '.list', tolerance: 'pointer' }) 
    $('.list').sortable({ connectWith: '.drawer', tolerance: 'pointer' }) 
    $('.drawer, .list').droppable({ 
    hoverClass: 'item-over', 
    tolerance: 'pointer', 
    drop : removeStyle 
    }) 
})

JSFiddle

來源

2016-08-08 MatUtter

使用MutationObserver監測風格的變化和火的時候，他們發生的事件：

var observer = new MutationObserver(function(mutations) { 
    mutations.forEach(function(mutationRecord) { 
     console.log('style changed!'); 
     // removeStyle(); 
    });  
}); 

var observationAttributes = { attributes : true, attributeFilter : ['style'] }; 
var target = document.getElementById('yourSortable'); 
var anotherTarget = document.getElementById('anotherSortable'); 

// Example of more than one observed element 
observer.observe(target, observationAttributes); 
observer.observe(anotherTarget, observationAttributes);

看到這裏約MutationRecords，我已經在MutationObserver回調經過如此循環每個風格變化都有removeStyle()之後被炒魷魚，所以風格肯定被刪除。

來源

2016-08-08 01:28:00

如何刪除可排序的樣式屬性？

回答

相關問題