Prototype.js: reset setStyle

Question

Có cách nào để đặt lại kiểu về những gì trong CSS của tôi không?

Ví dụ:

#foo {width: 50px; height: 50px; position: absolute; top: 150px; left: 250px;} 


function moveFoo(newpostop, newposleft){ 
    $('foo').setStyle({top: newpostop+'px', left: newposleft+'px'}); 
} 

Bây giờ khi tôi đang thực hiện với nó, tôi muốn di chuyển foo trở lại khi nó được. Tôi biết nó có thể được mã hóa cứng, nhưng tôi cần phải làm điều này với 25 div khác nhau.

Cảm ơn

Answer 1

Setting phong cách không loại trừ tất cả các yếu tố trong lớp CSS. Nó chỉ ghi đè lên những cái đã bị thay đổi. Kiểu thực sự của điều khiển là sự kết hợp của kiểu CSS và kiểu tùy chỉnh trên thuộc tính style. Để hoàn nguyên về kiểu CSS hoàn toàn, chỉ cần xóa thuộc tính style.

$('#foo').removeAttr('style'); 

EDIT:

Rõ ràng ở trên không hoạt động. Tôi đã được thông báo trong các nhận xét rằng những điều sau đây, tuy nhiên, không:

$('#foo').writeAttr('style', ''); 

Answer 2

Bạn có thể xóa thuộc tính nhưng tôi không nghĩ bạn có thể hoàn nguyên thuộc tính.

Bạn có thể hoàn nguyên nếu bạn đang sử dụng biểu định kiểu bổ sung để thay đổi bố cục. Bằng cách đó, bạn sẽ có thể bật biểu định kiểu để hiển thị thay đổi và vô hiệu hóa nó để hoàn tác nó.

Giải pháp tốt nhất có lẽ sẽ để lưu trữ các thuộc tính cũ sang một mảng, và sử dụng mảng để thay đổi các thuộc tính phong cách của bạn trở lại

Something như thế này:

var tempStyle = new Array(); 

    function moveFoo(newpostop, newposleft){ 
     tempStyle ["foo"] = new Array(); 
     tempStyle ["foo"]["top"] = newpostop; 
     tempStyle ["foo"]["left"] = newposleft; 

     $('foo').setStyle({top: newpostop+'px', left: newposleft+'px'}); 
    } 

    function restoreFoo(){ 
     $('foo').setStyle({top: tempStyle ["foo"]["top"]+'px', left: tempStyle ["foo"]["left"]+'px'}); 
    } 

Answer 3

Thiết lập một phong cách với một null -giá trị thực hiện thủ thuật với unsetting trong prototype.js

Vì vậy, bạn cũng có thể sử dụng $('foo').setStyle({top:null,left:null}) để hoàn nguyên các thay đổi bạn đã thực hiện.

Answer 4

Bạn có thể sử dụng đồng bằng lệnh Javascript cho rằng, đối với tôi hoạt động tốt:.

$('foo').removeAttribute('style'); 

sẽ loại bỏ toàn bộ style = "" yếu tố