2010-10-10 13 views
11

Tôi đã cố gắng áp dụng user-select cho cả Opera 10.62 và IE9 mà không thành công. Tôi không thể/sẽ không ràng buộc các sự kiện với JavaScript preventDefault(), bởi vì có quá nhiều địa điểm cần được đặt không thể chọn và tôi vẫn cần giữ lại các lựa chọn ở một số nơi. Trong thực tế, tôi muốn hành vi mặc định là unselectable cho toàn bộ tài liệu, và như cho rằng tôi có thiết lập sau đây trong stylesheet của tôi:Có người dùng chọn Opera 10.62 và IE9 không?

* { 
    -o-user-select: none; 
    -webkit-user-select: none; 
    -moz-user-select: -moz-none; 
    -khtml-user-select: none; 
    -ms-user-select: none; 
    user-select: none; 
} 

Tất cả mọi thứ hoạt động tốt với Firefox 4, Chrome 7 và Safari 5. Chỉ IE9 và Opera 10.62 không hoạt động như tôi muốn. Bất kỳ ý tưởng?

PS: Tôi đang nhắm mục tiêu các trình duyệt hiện đại.

+0

Xem: http://stackoverflow.com/questions/826782/css-rule-to-disable-text-selection-highlighting – mahalie

Trả lời

7

Bạn đã thử sử dụng ::selection {color:currentColor;background:transparent}?
Đối với Firefox, bạn có thể sử dụng ::-moz-selection.

https://developer.mozilla.org/En/CSS/::selection
http://msdn.microsoft.com/en-us/library/ff974109(v=VS.85).aspx
http://reference.sitepoint.com/css/pseudoelement-selection


// cập nhật //
Ngoài ra còn có các unselectable tài sản.

+1

Yeah, nhưng đó là không thực sự tốt vì nó chỉ ẩn vùng chọn. Bạn vẫn có thể kéo vùng chọn và sao chép nó. – Tower

+0

kiểm tra cập nhật của tôi - và đọc https://developer.mozilla.org/en/CSS/-moz-user-select "Điều khiển giao diện (chỉ) của lựa chọn. Điều này không ảnh hưởng đến hoạt động lựa chọn thực tế." – Knu

+1

Một sự kết hợp của các thuộc tính -user-select và unselectable làm việc một điều trị cho tôi qua trình duyệt. – ajcw

2

chọn người dùng không phải là thuộc tính CSS3 chuẩn, đó là lý do tại sao không có người dùng chọn hoặc -o-người dùng chọn hoặc -ms-người dùng chọn. Nó thường nằm trong thông số giao diện người dùng cũ, nhưng được thay thế bằng thông số UI cơ bản. Nó có thể sẽ không bao giờ được thực hiện bởi một trong hai trình duyệt, trừ khi nó được thêm trở lại spec.

Lựa chọn của người dùng là hành vi thay vì kiểu, vì vậy tốt nhất nên sử dụng JavaScript. Như Knu đề cập ở trên, bạn có thể sử dụng unselectable thay thế.

+3

Nhưng điều khủng khiếp là trẻ em không kế thừa 'không thể chọn '. Vì vậy, tôi sẽ cần phải áp dụng cho tất cả mọi thứ khá nhiều, bằng tay. Tôi có một ứng dụng với văn bản ở đây và ở đó, và theo mặc định, tôi muốn mọi thứ không thể chọn được. Chỉ khi tôi đặc biệt muốn lựa chọn, tôi sẽ xác định chúng. Cách tiếp cận này không thể thực hiện được với 'unselectable'. Ngoài ra, thuộc tính này hoạt động nếu bạn bắt đầu lựa chọn trên phần tử đó. Ctrl + A, v.v. sẽ hoạt động với 'unselectable'. – Tower

+0

Thực ra Opera có '-o-user-select'. Không chắc chắn phiên bản nào nhưng tôi nghĩ 10.6 đã có nó. –

+1

@Tim Down: Tôi khá chắc chắn Opera không hỗ trợ -o-user-select. Nó không được liệt kê trong spec của chúng tôi http://www.opera.com/docs/specs/presto29/css/o-vendor/ và nó cũng không hiển thị trong Opera Dragonfly. –

4

Bạn có thể sử dụng sự kết hợp của -webkit-user-select: none;, -moz-user-select: none; và tài sản unselectable="on" cụ thể, như tôi đã mô tả ở đây:

How to make text unselectable on HTML page

+0

Sẽ không hoạt động trong IE 9 & 8, chỉ là thuộc tính – dude

0

Sử dụng jquery:

$('.element').mousedown(function(e) { 
    e.preventDefault(); 
}); 

Nhưng bạn có thể phải thêm nó cả phần tử và thùng chứa của nó.

0

-ms-user-select: none;

dường như làm việc tốt bây giờ (IE 10/11)

+0

Wow! Tôi nghĩ IE11 được cho là sẽ hỗ trợ các tiêu chuẩn chính thức mà không cần phải có các hacks cụ thể của trình duyệt! Khi họ giới thiệu hỗ trợ cho điều này, tại sao không đi trực tiếp trên tiêu chuẩn mà không có tiền tố trình duyệt ?? !!! (Và có - tôi đã thử nghiệm trong IE 11; nó chỉ hoạt động *** với *** tiền tố '-ms-') – awe

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