【前端】移动端Web中,如何使用JS动态修改用户选中的位置,并且保持“拖拽cursor”的存在?

我们有一个非常特殊的需求,请大家帮帮忙。

如下图所示,我们需要做一个文章页,用户可以在这个页面里进行划选操作。但是,每当用户划选结束后,我们需要做一下判断,是否前面的“小耳朵”超出了允许划选的范围,然后通过调整Selection range的方法,把这个划选内容退回到指定的Element元素后面,比如我们会在某个地方,放一个特殊的hr元素,用于指示哪里可以是划选的起点。

【前端】移动端Web中,如何使用JS动态修改用户选中的位置,并且保持“拖拽cursor”的存在?

我们已经试过Selection自带的一些修改Range范围的方法,但是有一个很大的问题,那就是一旦改了Selection的Range,就会导致这个小耳朵消失了,用户无法重新拉着他们修改范围了。

请问,有什么办法可以做到:用户划选结束后,我们根据情况调整一下划选的范围,然后用户可以继续拉小耳朵来调整范围。

多谢

回答

让可选择的区域正常选择,不可以选的设置css user-select: none;

以上是 【前端】移动端Web中,如何使用JS动态修改用户选中的位置,并且保持“拖拽cursor”的存在? 的全部内容, 来源链接: utcz.com/a/80972.html

回到顶部