通过单击并拖动来更新 HTML 输入字段的值(类似于 unity3d 界面）

Update the value of a HTML input field by clicking and dragging (similar to unity3d interface)

本文关键字：类似于 unity3d 界面 字段 输入 单击 拖动 HTML 更新      更新时间：2023-09-26

Unity 有一个超酷的范围滑块，我在复制 Web 功能时遇到了问题。

使用 unity，您可以单击字母 X 并向左拖动，输入字段将显示一个递减的数字。

如果单击字母 X 并向右拖动，输入字段将显示一个递增的数字。

但是 X 没有滑块，无论输入字段中的值如何，它总是在同一个位置。

一种方法是设置一个函数，将鼠标悬停在包含"X"的元素上以获取起始位置。然后将一个函数绑定到 mousemove，该函数计算当前位置与 X 轴上起始位置之间的差异，以确定要放置在输入字段中的值。

概念验证：https://gist.github.com/anonymous/95191c56796fb2e4e5cd

代码中包含注释以解释发生的过程。

更多信息：

http://www.w3schools.com/jsref/event_onmousemove.asp

http://www.w3schools.com/jsref/event_onmousedown.asp

http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_event_mouse_clientxy

相关文章：