请问 移动端点击登录按钮,按钮变色。再判断手放开的位置是否在登录按钮用什么方法比较好

2019-08-02 14:36:47 +08:00
 aria955

背景:我们在做 H5 的混合 APP.现在做登录按钮,点击变色,如果手放开在登录按钮上,就执行下一步。如果手放开的位置不在登录按钮上,恢复原色,不执行任何操作。

我的做法:使用 touch 事件。给登录元素注册 touchstart touchend 事件,然后获取元素的位置和宽高(使用的 rem,动态宽高)。在 touchstart 事件中,变色。 在 touchend 事件中,我们获取鼠标点击的位置,然后判断位置是否在元素内(一系列的比较)。如果在就执行下一步,不在就恢复颜色,不执行任何操作。

我的问题:感觉这个方法有点笨,然后跟同事沟通过,他有说 touchend 事件不应该注册在登录按钮上面,应该注册懂到全局,因为我们手会在其它地方释放的话,那 touchend 注册的元素就不准确。可以使用命中 target 方法来做,如果 touchstart 和 touchend 的 target 都在登录按钮上面的话,我们就执行下一步。(大致上是这个意思)。但是后来我注册到 body 的时候,发现 touchstart 和 touchend 的 target 只能是一样的。

希望: 有没有更好的方法来实现这个功能。

471 次点击
所在节点    问与答
0 条回复

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/588526

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX