javascript - 如何检查按钮是否被单击，在其上放置一个值，然后使用innerHTML？

Question

基本上我想为用户提供两个选项，是或否。例如，如果他单击“是”按钮，则此信息将被保存，我可以在问卷末尾显示他选择的内容。

我正在尝试这种方式，但它不起作用。最后，屏幕上什么都没有出现……

answer2-A = 是按钮

answer2-B = 无按钮

----------------------------------------//-------------------- ----//--------------

document.getElementById('answer2-A').addEventListener("click", defineYes);
document.getElementById('answer2-B').addEventListener("click", defineNo);
};
function defineYes(){
    document.getElementById('answer2-A').value = 'Yes';
    document.getElementById('info').innerHTML = document.getElementById('answer2-A');
};
function defineNo(){
    document.getElementById('answer2-B').value = 'No';
    document.getElementById('info').innerHTML = document.getElementById('answer2-B');

标签： javascript

Answer 1

几乎没有要解决的问题 - 没有看到 HTML，我认为该value属性未在按钮上设置。此外，您可以/应该获取对按钮的引用并重新使用它们，而不是一遍又一遍地查询。您可以使用target事件的 来访问您单击的按钮。

const yesBtn = document.getElementById('answer2-A')
const noBtn = document.getElementById('answer2-B')
const info = document.getElementById('info');

yesBtn.addEventListener("click", trackClick);
noBtn.addEventListener("click", trackClick);

function trackClick(e) {
  info.innerHTML = e.target.value;
}

<button id="answer2-A" value="Yes">Yes</button>
<button id="answer2-B" value="No">No</button>

<div id="info"></div>