Question

我正在尝试将javascript中的var设置为标记内的值。

<!DOCTYPE html>
<html>
<body>

<p>Click the button to return the value of its value attribute.</p>

<button id="myButton" value="value1" onclick="myFunction()">1</button>
<button id="myButton" value="value2" onclick="myFunction()">2</button>

<p id="output"></p>

<script>
function myFunction() {
    var x = document.getElementById("myButton").value;
    document.getElementById("output").innerHTML = x;
}
</script>

</body>
</html>

上面的代码显然不起作用，因为id是唯一的，所以无论我点击哪个按钮都会显示“value1”无关紧要。

有没有办法让它点击“1”按钮显示“value1”而“2”按钮显示“value2”？

Answer 1

<button value="value1" onclick="myFunction(this)">1</button>
<button value="value2" onclick="myFunction(this)">2</button>

<script>
function myFunction(button) {
    var x = button.value;
    button.innerHTML = x;
}
</script>

Answer 2

您可以在函数内部使用this，因此它引用了单击的元素

＆＃13;

function myFunction(e) {
  document.getElementById('output').innerHTML = e.value;
}

＆＃13;

<p>Click the button to return the value of its value attribute.</p>
<button value="value1" onclick="myFunction(this)">1</button>
<button value="value2" onclick="myFunction(this)">2</button>

<p id="output"></p>

＆＃13;

将javascript中的var设置为标记中的值

2 个答案: