javascript - 如何通过调用javascript中的函数来获取两个按钮不同的值

Question

function getValue(){

 var v = document.getElementById("btn2").value;
 document.getElementById("display").value += v;

}

        <input type ="text" id = "display" value = "" ></input>
<tr>
                <td>
					<input type = "button" id = "btn2" value="7" onclick="getValue(this)" ></input>
				</td>
				<td>
					<input type = "button" id = "btn2" value="8" onclick="getValue(this)" ></input>
				</td>
</tr>

I just want to different value by clicking 8 or 7 button. but every time i got 7 as result what can i do please help.. and more i want to pass "this" in getValue(this) so that by clicking that button get the all information that buttton. plz help me thanks

Answer 1

你的 ID 在 dom 中应该是唯一的。 jQuery 在调用 $('#idstring'); 时仅返回第一个元素document.getElementById('#idstring') 也是如此。

在这种情况下，您可以使用 className。

您还向函数传递了一个参数，但您没有使用它。

我编辑了此代码片段以展示如何在调用函数之前将其绑定(bind)到函数。像这样，如果你喜欢的话，你可以使用“this”。

function getValue(el) {
  document.getElementById("display").value = el.value;

}

function getValue2() {
  document.getElementById("display").value = this.value;
}

<input type="text" id="display" value=""></input>
<tr>
  <td>
    <input type="button" class="btn2" value="7" onclick="getValue(this)"></input>
  </td>
  <td>
    <input type="button" class="btn2" value="8" onclick="getValue2.bind(this)()"></input>
  </td>
</tr>