点击事件不会被触发

Question

我希望用户在点击时选择整个输入框。

在我的情况下，输入框是：

      <label for="bla">My checkbox</label>
      <input type="input" id="bla" name="check" value="checked" />

为此，我编写了以下 JS：

function SelectAll(bar){   
    bar.focus();
    bar.select();
    console.log(bar);
}    
window.onload=function()
{
   var bla=document.getElementById("bla");
   bla.addEventListener('click',SelectAll(bla),false);       
};

但我在控制台中得到的只是<input type="input" value="checked" name="check" id="bla"> 一次，无论我点击多少，我都无法获得更多。

Answer 1

addEventListener回调引用应该没有参数。

.addEventListener('click', SelectAll)

通过添加(bla)，它实际上被称为SelectAll(bla)(element)，这不是你想要的。

Answer 2

总结我的研究，我得出以下结论：

addEventListener 回调引用应该没有参数，因为它将事件传递给函数。

因此，实现listener 的正确方法是.addEventListener('click', SelectAll, false)。

由于event 已传递，但您想使用实际的element，您将需要使用bar.target 来访问它。

Answer 3

试试这个：

$( "#bla" ).click(function() {
     bla.addEventListener('click',SelectAll(bla),false);    
    });
function SelectAll(element){   
    element.focus();
    element.select();
    console.log(element);
}