JQUERY如何在拖动时禁用不允许的光标？
在使用jQuery进行拖动操作时，可以通过CSS样式来禁用不允许的光标。具体步骤如下：
- 首先，给需要进行拖动的元素添加一个class，例如"draggable"。
- 使用jQuery的draggable()方法将该元素设置为可拖动，同时指定拖动时的一些配置参数。
- 在配置参数中，使用"start"回调函数来处理拖动开始时的事件。
- 在"start"回调函数中，使用CSS样式来禁用不允许的光标。
下面是一个示例代码：
<!DOCTYPE html>
<html>
<head>
<title>jQuery拖动禁用光标示例</title>
<style>
.draggable {
width: 100px;
height: 100px;
background-color: #ccc;
cursor: move;
}
.disabled {
cursor: not-allowed;
}
</style>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function() {
$(".draggable").draggable({
start: function(event, ui) {
// 判断是否禁用拖动
if ($(this).hasClass("disabled")) {
// 禁用光标
$(this).css("cursor", "not-allowed");
// 取消拖动
return false;
}
}
});
});
</script>
</head>
<body>
<div class="draggable">可拖动元素</div>
<div class="draggable disabled">禁用拖动元素</div>
</body>
</html>在上述示例中，我们定义了两个可拖动的元素，一个是可以拖动的，另一个是禁用拖动的。通过给禁用拖动元素添加"disabled"类，我们在拖动开始时判断该元素是否有"disabled"类，如果有，则禁用光标并取消拖动。
这里推荐使用腾讯云的CVM（云服务器）产品来进行云计算相关的开发和部署。您可以通过以下链接了解腾讯云CVM的详细信息：腾讯云CVM产品介绍。
相关·内容
1回答
我对不允许的游标有意见。当拖动" drag“元素时，不允许的光标出现，我不能再拖动它。我怎样才能防止这种情况呢？我想让我的“拖动”元素在鼠标按下时始终是“绝对”的。function (event) {
$("#log").text("pageX: " + event.pageX + ", pageY: "
浏览 4提问于2017-08-07得票数 5
在浏览器屏幕上拖动文件时，会出现鼠标光标一侧的图像，这是windows默认图像。这些图像是多种多样的，如Copy、Move和Forbide。看它的底部。
如何使用javascript或JQuery将鼠标光标的图像侧更改为此图像？例如，当我拖动一个文件并将鼠标移动到不可拖动的区域时，forbiden图像显示光标的一侧。
浏览 1提问于2015-12-14得票数 13
回答已采纳
我想使用jquery禁用拖动事件，并想用相同的鼠标事件绑定另一个事件，但它将显示错误<div class="mydiv"></div>jQuery('.mydiv').draggable("destroy");但是当我在div上按下鼠标并拖动光
浏览 0提问于2010-05-05得票数 3
回答已采纳
1回答
当我使用以下命令设置光标时 [[NSCursor closedHandCursor] set];在它切换回缺省游标后不久如何在拖放操作中设置光标？
浏览 2提问于2015-11-16得票数 3
我不得不使用javascript构建一个自定义的可拖动对象--我过去使用过jquery，但它在这个项目中不起作用。除了当用户单击对象( DIV)并在页面上拖动它时，他或她的光标会变成经典的I形文本选择器。在有问题的div的</e
浏览 0提问于2010-12-24得票数 4
回答已采纳
1回答
有没有注意到，如果您使用jQuery设置了一个可拖动的锚点()，并将其设置为显示某个光标，则无论您的选择如何，IE都会保持指针显示。参见下面的示例代码：IE似乎会保持鼠标按下时的光标样式，直到释放按钮为止有人知道如何在拖动
浏览 1提问于2011-02-15得票数 2
我正在尝试使用jQuery Knob作为一个恒温器UI。我想允许控制范围的能力(热-冷)。
我已经能够通过堆叠几个旋钮实现这个外观，然而，这基本上禁用了点击/拖动功能。红色光标:热，蓝色光标:凉爽，白色光标:当前温度。
浏览 4提问于2015-02-09得票数 0
回答已采纳
也许这个问题本身没有太大的意义，所以让我来解释一下……我正在开发一个交互式地图应用程序，除了其他功能外，它还允许您在放大时在地图上移动。只需单击并拖动即可。这个特性是通过使用jQuery-UI实现的。
我的问题是，默认情况下，拖动的系数是1，这意味着将光标移动1像素会将地图拖动1像素。我需要的是有一个‘乘数’(可能在1-10的范围内)，这样通过移动光标1个像素，地
浏览 0提问于2012-03-02得票数 3
回答已采纳
我正在尝试使用外部按钮在中创建类似的标签框：我能够插入html并使用jquery将css添加到其中。redactor.insertHtml('<div class="templateTag">' + inputValue + '</div>');有没有办法禁用闪烁的<em
浏览 3提问于2013-06-20得票数 0
2回答
拖动时更改光标
、、、、
是否可以在拖动时更改光标？<img id="drag1" class="drag" src="http://www.surfixe.com/img/tick2.png" dragga
浏览 1提问于2013-04-28得票数 6
1回答
光标类型:仅在拖动时移动
、、、、
我实现了一个元素，使其具有一个具有游标类型"move“的JQuery UI拖动函数。我想要达到的目标：
当光标在inner
浏览 2提问于2015-12-03得票数 4
回答已采纳
2回答
我已经使用JavaScript构建了一个拖放界面，用户可以在其中单击并拖动链接(有时带有CSS背景图像)并将其放到画布上。
我的问题是，在拖动过程中，鼠标光标在其下方有链接背景图像。我需要添加我自己的光标设计，所以有没有办法关闭这个CSS背景，这样它在拖动时就不会跟随鼠标？
浏览 3提问于2011-09-08得票数 1
回答已采纳
2回答
我正在开发一个web应用程序，我需要覆盖一些默认的光标。$(document).css('cursor','default');在chrome中，它似乎不是在点击时显示，而是在鼠标移动时显示。
浏览 1提问于2011-06-17得票数 4
3回答
我在jQuery中使用拖放时遇到了问题。这是一个非常简单的小提琴，它显示了我的意思()： drop: function (e, ui) { }$('#drag').draggable({});
如您所见，我在拖动时将光标设
浏览 1提问于2013-05-09得票数 4
回答已采纳
当用户将文件或项目拖到我的控件上时，我需要向用户显示弹出窗口。弹出窗口基本上是通过给他一条消息来通知他为什么要禁用拖动。我希望弹出窗口跟随鼠标光标，而他仍然在拖动模式。或者，是否有一种方法可以在拖动和显示光标旁边的文本时更改鼠标光标？如果你们有其他的设计可以推荐的话..那也太好了。
谢谢你的建议！
浏览 4提问于2010-08-12得票数 1
4回答
我需要弄清楚如何在某些行上禁用拖动，或者拒绝这些行的拖放。我使用的条件是数据行中的一个值。我有什么选择？如何根据条件禁用或拒绝拖放？
浏览 1提问于2011-10-07得票数 5
回答已采纳
1回答
正如您在这个活生生的例子中所看到的:当我们试图拖动主可拖动元素(div.outer)时，每次鼠标经过div.inner时，甚至当鼠标超出可拖动框(即进入body区域)时，光标都会迅速更改为不允许的，并立即更改为正常移动有一个标记来显示嵌套的情况：
浏览 4提问于2014-08-05得票数 2
回答已采纳
我已经在使用拖动事件的第一个产品图像上设置了一个自定义脚本。但现在，当我拖动时，滑块开始工作。我已经知道了如何在页面加载后禁用拖动(通过firebug)。但是如何在woocommerce设置后立即禁用它？1000);
//disable draggable for gallery
$carousel = jQue
浏览 55提问于2020-04-10得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
即时通信 IM
对象存储活动推荐
腾讯云开发者
