javascript - 在鼠标移动时仅选择一次 li 元素

Question

我有一个 li 元素列表。

我试图通过鼠标单击+鼠标移动来选择这些元素。 但是，它在我的 mousemove 函数中多次选择相同的元素:

this.querySelector('.directory-list').addEventListener('mousedown', (e) => {

        this.querySelector('.directory-list').onmousemove = function(e) {
          this._target = (e.target) ? e.target: e.srcElement;
          this._target.select();      
        } 
 });

假设我有这样的东西:

如果我想用鼠标选择这两个目录，由于我的“onmousemove”功能，它会选择它们大约10次。

有什么方法可以在这样做时消除重复项吗？

Answer 1

您可以检查 __target 是否已定义，然后仅在未定义时定义/选择它。

this.querySelector('.directory-list').addEventListener('mousedown', (e) => {
        this.querySelector('.directory-list').onmousemove = function(e) {
            if (!this_target) {
               this._target = (e.target) ? e.target: e.srcElement;
               this._target.select();      
            }
        } 
 });

然后在鼠标松开时将其设置为 null。