在输出结果之前我如何点击按钮

how do I button clicked before outputting the results?

本文关键字：何点击 按钮 输出 结果      更新时间：2023-09-26

所以有2个单选项，我希望用户选择执行哪一个，在用户选择其中一个后，他/她将点击按钮"绘制!"并将从他们选择的单选项的一个函数输出结果。但是我不知道如何调用这两个函数，直到用户点击"绘制!"按钮才真正调用函数。

在我的HTML中有: 
<p>
Do you want to <input type="radio" name="draw" id="draw" value="drawTriangle">Draw Triangle
or
<input type="radio" name="draw" id="draw" value="drawZigZag">Draw ZigZag<br>
<input type="button" value="Draw!" onclick="drawEither()">
</p>
<pre id="outputTriangle">
</pre>
<pre id="outputZigZag">
</pre>

和Javascript: 

function makeZigZag () {
var sizeTextField = document.getElementById('sizeTextField')
//block of codes
drawButton.onclick = function () {
    outputTri.innerHTML = makeTriangle(sizeTextField.value);
};
}
function makeTriangle () {
var sizeTextField = document.getElementById('sizeTextField')
//block of codes
drawButton.onclick = function () {
    outputZZ.innerHTML = makeTriangle(sizeTextField.value);
};
}
function drawEither () {
outputTri = document.getElementById('outputTriangle');
outputZZ = document.getElementById('outputZigZag');
}

一种方法是循环检查哪个单选按钮被选中。比如:

function drawEither () {
  if (document.getElementById('drawTriangle').checked) {
    do stuff for radio 1
  } else {
    do stuff for radio 2
  }
}
顺便说一下，在示例HTML中有重复的id。id必须唯一。我在示例中使用了建议ID。
相关文章：