Как отключить Firefox по умолчанию перетаскивать все поведение изображений с помощью jQuery?
У Firefox есть это досадное поведение, которое позволяет пользователю перетаскивать любой элемент изображения по умолчанию. Как я могу полностью отключить это поведение по умолчанию с помощью jQuery?
Ответы
Ответ 1
Следующее будет сделано в Firefox 3 и более поздних версиях:
$(document).on("dragstart", function() {
return false;
});
Если вы не хотите отключать все перетаскивания (например, вы можете разрешить пользователям перетаскивать ссылки на панель инструментов ссылок), вы можете убедиться, что предотвращено только перетаскивание элементов <img>
:
$(document).on("dragstart", function(e) {
if (e.target.nodeName.toUpperCase() == "IMG") {
return false;
}
});
Имейте в виду, что это позволит перемещать изображения в пределах ссылок.
Ответ 2
Нужно ли быть jQuery? Вам просто нужно определить функцию обратного вызова для вашего события mousedown на изображении (ых), о котором идет речь, с помощью event.preventDefault()
.
Таким образом, ваш тег изображения может выглядеть так:
<img src="myimage.jpg" onmousedown="if (event.preventDefault) event.preventDefault()" />
Дополнительный if
необходим, потому что иначе IE выдает ошибку. Если вам нужно это для всех тегов изображений, вам просто нужно перебирать теги img
с помощью jQuery и присоединять обработчик события onmousedown.
На этой странице есть приятное объяснение (и пример): " Отключить перетаскивание изображений в FireFox", а не так хорошо документированная версия здесь, используя jQuery в качестве ссылки: " Отключить перетаскивание изображения Firefox
Ответ 3
Если Javascript является необязательным требованием, вы можете попробовать с помощью CSS
.wrapper img {
pointer-events: none;
}
Ответ 4
Решение без jQuery:
document.addEventListener('dragstart', function (e) {
e.preventDefault();
});
Ответ 5
Ссылаясь на решение Tim Down, вы можете достичь эквивалента своего второго фрагмента кода только для отключения img
перетаскивания при использовании jQuery:
$(document).on("dragstart", "img", function() {
return false;
});
Ответ 6
Я не помню свой источник, но работаю
<script type="text/javascript">
// register onLoad event with anonymous function
window.onload = function (e) {
var evt = e || window.event,// define event (cross browser)
imgs, // images collection
i; // used in local loop
// if preventDefault exists, then define onmousedown event handlers
if (evt.preventDefault) {
// collect all images on the page
imgs = document.getElementsByTagName('img');
// loop through fetched images
for (i = 0; i < imgs.length; i++) {
// and define onmousedown event handler
imgs[i].onmousedown = disableDragging;
}
}
};
// disable image dragging
function disableDragging(e) {
e.preventDefault();
}
</script>