2009-01-29 62 views
73

Nếu tôi đặt một giá trị CSS trên một yếu tố cụ thể sử dụng:Làm cách nào để bỏ đặt thuộc tính CSS của phần tử bằng jQuery?

$('#element').css('background-color', '#ccc'); 

Tôi muốn để có thể bỏ đặt mà giá trị phần tử cụ thể và sử dụng giá trị cascaded, dọc theo dòng:

$('#element').css('background-color', null); 

Nhưng cú pháp đó dường như không hoạt động - liệu điều này có thể sử dụng cú pháp khác không?

Cảm ơn trước!

Chỉnh sửa: Giá trị không được kế thừa từ phần tử gốc - giá trị ban đầu đến từ bộ chọn cấp phần tử. Xin lỗi vì bất kỳ sự nhầm lẫn nào!

Trả lời

107

Từ jQuery docs:

Thiết lập giá trị của một thuộc tính cho một chuỗi rỗng - ví dụ $('#mydiv').css('color', '') - loại bỏ thuộc tính đó khỏi một phần tử nếu nó đã được áp dụng trực tiếp, cho dù thuộc tính kiểu HTML, thông qua phương thức .css() của jQuery hay thông qua thao tác DOM trực tiếp của thuộc tính style. Tuy nhiên, nó không loại bỏ một kiểu đã được áp dụng với một quy tắc CSS trong một biểu định kiểu hoặc một phần tử <style>.

+0

Tôi đã xem qua câu hỏi này khi tôi gặp sự cố này. Trong trường hợp của tôi, tôi đã thiết lập thuộc tính css trong thuộc tính 'style' trên thẻ, vì vậy phương thức này không hoạt động. Áp dụng kiểu với phương thức '.css()' thay vì trong thẻ cho phép tôi loại bỏ nó sau này. –

3

Hãy thử điều này:

$('#element').css('background-color', 'inherit'); 
+1

Rất tiếc, không thể thừa kế hành vi mà tôi đang tìm kiếm: "thuộc tính có cùng giá trị được tính là thuộc tính cho cha mẹ của phần tử" từ http://www.w3.org/TR/CSS2/cascade.html – cdleary

4

Trên thực tế, cú pháp mà tôi nghĩ là không chính xác (với null) dường như được làm việc - selector của tôi đã được chỉ định hình kém, và do đó năng suất không yếu tố. D'oh!

+20

Kể từ jquery 1.4.3 'css (..., null)' không hoạt động và 'css (..., '')' nên được sử dụng thay thế - http://bugs.jquery.com/ticket/ 7233 –

+0

@cdleary Bạn nên sửa câu trả lời hoặc chọn câu trả lời đúng. –

10

Tôi nghĩ bạn cũng có thể làm:

$('#element').css('background-color', ''); 

Đó là những gì tôi đã sử dụng để làm một thời gian dài trước đây cho display tài sản ở đồng bằng tuổi javascript để hiển thị/ẩn một lĩnh vực.

0

Đối với những gì nó có giá trị này dường như không làm việc trong IE 8 cho 'lọc,' Tôi đã phải sử dụng này (trong fadeIn callback):

$(this).attr('style', $(this).attr('style').replace(/\bfilter:\s*;*/, ''));

Rõ ràng, tôi có cần phải loại bỏ khai báo bộ lọc nội dòng trống để CSS có thể có hiệu lực; có các quy tắc nội tuyến khác nên tôi không thể xóa thuộc tính kiểu.

Các vấn đề liên quan