单击新选项后，如何清除上一个选项的结果。它不断将自身附加到上一个选项

Question

选择新选项时，我想清除上一部分。我希望这些问题一次显示一次。

html

r

javascript

<form> 
    <select id="changequestion" onchange="activatechangequestion()">
    <option value="1">What is Y% of X</option>
    <option value="2">X is Y% of what</option>
    </select>

    <section id="question1" hidden>
        What is <input type="text" name="" placeholder="Y"> % of <input type="text" name="" placeholder="X" >  
    </section>
    <section id="question2" hidden>
        <input type="text" name="" placeholder="X"> is <input type="text" name="" placeholder="Y"> % of what?  
    </section>
</form>

Answer 1

我相信将您的JavaScript更改为以下内容将实现所需的功能：

    var tfield1=document.getElementById("textfield1");
    var tfield2=document.getElementById("textfield2");
    var rfield=document.getElementById("resultfield");
    var form=document.getElementById("formcalculate");

    function activatechangequestion(){
        var changequestion=document.getElementById("changequestion").value;
        var getQuestionNumber= parseInt(changequestion);

        switch(getQuestionNumber){
            case 1:
                document.getElementById("question1").removeAttribute("hidden");
                document.getElementById("question2").setAttribute("hidden", "hidden");              
            break;

            case 2:
                document.getElementById("question2").removeAttribute("hidden"); 
                document.getElementById("question1").setAttribute("hidden", "hidden");
            break;
        }
    }

在每种情况下，无论您希望不显示任何问题，均添加以下内容：

document.getElementById("question[NUMBER]").setAttribute("hidden", "hidden");