Javascript 图像裁剪器:如何防止默认拖动n';放弃行动?

Javascript 图像裁剪器:如何防止默认拖动n';放弃行动?,javascript,crop,Javascript,Crop,我正在开发一个图像裁剪器,想问你以下问题:为了防止在按下图像上的左键并保持按下状态时出现默认的拖放操作,请尝试移动鼠标,如果只是将图片用作div框的背景,这不是跨浏览器吗 就这样: <div id="theDiv" style="background:url(pic.png) no-repeat;"></div> 你觉得怎么样?可以接受吗?不太难看吗?或者应该用JS来完成吗?我也会这么做,就我所知,没有真正的其他方法来做你想做的事情,crossbrowser。你使

我正在开发一个图像裁剪器,想问你以下问题:为了防止在按下图像上的左键并保持按下状态时出现默认的拖放操作,请尝试移动鼠标,如果只是将图片用作div框的背景,这不是跨浏览器吗

就这样:

<div id="theDiv" style="background:url(pic.png) no-repeat;"></div> 


你觉得怎么样?可以接受吗?不太难看吗?或者应该用JS来完成吗?

我也会这么做,就我所知,没有真正的其他方法来做你想做的事情,crossbrowser。

你使用的是框架吗?它们中的每一个不是都有一个可靠的“dragstart”实现,可以简单地使其返回false吗?如果我错了,请纠正我。

您可以设置自己的鼠标事件,这将更符合逻辑。您甚至不需要基于每个浏览器编写代码。 此事件处理程序也可用于设置裁剪帧

但是,如果您没有扩展这么多的计划,那么您的方法更简单

如果只是将图片用作div框的背景,这不是跨浏览器吗

是的,但你还是会开始拖;如果将指针移到包含文本的部分页面中,您将选择可能不需要的文本


我坚持使用
x.ondragstart=x.onmousedown=function(){return false;}

我可能会使用
draggable=“false”
ondrag=“return false”
,但您的方法也同样有效。

您可以看看这个例子,它是一个用纯JavaScript编写的简单而快速的图像裁剪器。它使用mousedown检测拖动开始,使用mouseup检测拖动结束。在拖动过程中,它会侦听
document.onmousemove
事件。

查看同一海报的