小编use*_*232的帖子

更改 HTML 中输入元素上的鼠标光标

我有各种可通过拖放移动的 HTML 元素。为了指出(向用户)放置元素的有效区域,我正在更改光标的外观。我通过简单地通过 JS 应用 CSS 类来做到这一点,其中包含一个简单的“cursor:xxx”。这对于 DIV 和 SPAN 来说效果很好。

但是当我尝试使用文本输入或文本区域执行此操作时,光标就会变成“|” (文本编辑光标)。

有没有办法覆盖此默认行为或者是否有任何解决方法(无需用任何虚拟元素替换这些元素,因为这会花费大量时间,因为某些功能会依赖这些元素)

CSS:

body.draggingInvalid ,
body.draggingInvalid * {
    cursor:not-allowed !important;
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}
Run Code Online (Sandbox Code Playgroud)

HTML:

<input type="text" style="width: 200px; height: 20px;">
Run Code Online (Sandbox Code Playgroud)

html css drag-and-drop mouse-cursor

5
推荐指数
1
解决办法
1万
查看次数

标签 统计

css ×1

drag-and-drop ×1

html ×1

mouse-cursor ×1