尝试使用onclick调用函数时未定义值

Value is not defined when trying to call with function with onclick

本文关键字:函数 未定义 调用 onclick      更新时间:2023-09-26

当我试图将(onclick)值发送到toggle_sprint()函数时,我得到一个错误,即没有定义值。为什么它没有定义?当我设置value="false"时,我以为它已经被定义了,但显然不是。

<div class="select">
    <div id="toggle_sprint" value="false" onclick="toggle_sprint(value);" >Toggle Sprint</div>
</div>

div元素没有value属性…而且div元素的设计也不是交互式的,所以在div上点击onclick会产生一堆可访问性问题。

此外,使用内部事件属性意味着toggle_sprint()可能不是您认为的那样

从编写好的HTML开始。

使用data-*属性仅为JS提供数据。使用按钮来提供点击和触发JS的东西。

然后用JavaScript绑定事件处理程序。

    document.getElementById("toggle_sprint").addEventListener("click", function(event) {
      toggle_sprint(this.dataset.value);
    });
    function toggle_sprint(arg) {
      console.log(arg);
    }
<div class="select">
  <button type="button" id="toggle_sprint" data-value="false">Toggle Sprint</button>
</div>