HTML5 kéo = 'false' không làm việc trong trình duyệt Firefox

Question

Tôi chỉ đơn giản là cố gắng áp dụng 'false' thuộc tính HTML5 kéo = một số hình ảnh nhưng nó không làm việc trong trình duyệt Firefox. Trong Chrome hoạt động tốt nhưng trên Firefox, sau khi chọn hình ảnh đó có thể kéo và thả. Mẫu mã có thể được nhìn thấy ở đây:

<div id="dnd"> 
    <textarea placeholder="drop here"></textarea> 
    <img src="http://johnlewis.scene7.com/is/image/JohnLewis/231108668?$prod_main$" draggable='false'/> 
</div> 

Jsfiddle

Tôi đang gặp Firefox phiên bản mới nhất: 32.0.3

Google rất nhiều nhưng không tìm thấy bất kỳ giải pháp tốt hơn. Có bất kỳ giải pháp cho điều này mà không cần sử dụng JavaScript? Bất kỳ trợ giúp sẽ được đánh giá cao.

Cảm ơn

Answer 1

Bạn có thể thiết lập các thuộc tính CSS sau đây để hình ảnh:

.unselectable { 
    /* For Opera and <= IE9, we need to add unselectable="on" attribute onto each element */ 
    /* Check this site for more details: http://help.dottoro.com/lhwdpnva.php */ 
    -moz-user-select: none; /* These user-select properties are inheritable, used to prevent text selection */ 
    -webkit-user-select: none; 
    -ms-user-select: none; /* From IE10 only */ 
    user-select: none; /* Not valid CSS yet, as of July 2012 */ 

    -webkit-user-drag: none; /* Prevents dragging of images/divs etc */ 
    user-drag: none; 
} 

HTML code:

<img src="something.jpg" class="unselectable"> 

Fiddle

Answer 2

chỉ thử

này

thêm ondragstart = "return false;" đến yếu tố html của bạn

<div id="dnd"> 
 
    <textarea placeholder="drop here"></textarea> 
 
    <img src="http://johnlewis.scene7.com/is/image/JohnLewis/231108668?$prod_main$" draggable='false' ondragstart="return false;"/> 
 
</div>