Javascript 如何获得几个按钮的一个值&引用；未捕获类型错误：无法读取属性；

我想得到我创建的四个按钮中的一个的值。我试着在下面的代码中这样做，当我使用console.log时效果很好，但是当我只想返回我得到的值：“uncaughtypeerror:无法读取未定义的at direction（script.js:16）”的属性“id”

你知道怎么处理吗

<div class="dirButtons">
    <input type="button" id="right" class="button" name="direction" value="to right" onclick="direction(this)">
    <input type="button" id="left" class="button" name="direction" value="to left" onclick="direction(this)">
    <input type="button" id="bottom" class="button" name="direction" value="to bottom" onclick="direction(this)">
    <input type="button" id="top" class="button"name="direction" value="to top" onclick="direction(this)">
</div>

---

这应该是您要查找的内容。

当您在元素的

onclick事件中传递
函数（This）
时，您真正传递的是元素，而不是事件，因此您希望直接访问
元素的
值


功能方向（元素）{
console.log（element.value）；
}
老实说，从我所看到的情况来看，这应该可以很好地工作，但是由于某些原因，您传递给事件处理程序的
这个
是未定义的。也就是说，出于以下几个原因，你所做的是相当多余和糟糕的实践

不需要将目标元素传递给事件处理程序，因为它已经包含在事件对象中
您不应该命名事件处理程序参数
event
，因为这会覆盖事件处理程序上下文（）中包含的事件对象
因此，在这种情况下，最好改为：

<div class="dirButtons">
    <input type="button" id="right" class="button" name="direction" value="to right" onclick="direction()">
    <input type="button" id="left" class="button" name="direction" value="to left" onclick="direction()">
    <input type="button" id="bottom" class="button" name="direction" value="to bottom" onclick="direction()">
    <input type="button" id="top" class="button"name="direction" value="to top" onclick="direction()">
</div>

返回什么值？不确定return如何处理该代码。您正在传递“this”，这是对元素的引用，但在脚本中，您将其视为事件。为什么不传递这个。值？谢谢你的回答。然而，我现在得到了它，而不是
console.log（element.value）
I make
returnelement.value
并尝试在另一个函数中使用此值，我仍然会得到“UncaughtTypeError:无法读取未定义方向的属性'value'，这是因为该函数是从另一个上下文调用的（这意味着元素必须调用它才能成功检索元素的值）。您可以尝试更新您的问题，并包括代码的其余部分，以查看我们如何修改它。事先我可以告诉你，你可以把函数上最后一次调用的值保存到一个变量中。现在它可以正常工作了！现在我明白我犯了什么错误。谢谢
function direction(event){
    console.log(event.value);   
}

<div class="dirButtons">
    <input type="button" id="right" class="button" name="direction" value="to right" onclick="direction()">
    <input type="button" id="left" class="button" name="direction" value="to left" onclick="direction()">
    <input type="button" id="bottom" class="button" name="direction" value="to bottom" onclick="direction()">
    <input type="button" id="top" class="button"name="direction" value="to top" onclick="direction()">
</div>

function direction(){
    console.log(event.target.value);   
}