javascript - 从下拉列表中获取值并在 Java 脚本的同一页面中显示结果

Question

这是标题。它在新页面中给出结果，而我想在代码运行的同一页面中显示结果。请帮忙。

function calculate() {
    var width = document.getElementById("width");
    width1 =  width.options[width.selectedIndex].text;  
    var height = document.getElementById("height");
    var height1 =  height.options[height.selectedIndex].text;    
    var calculate = width1 * height1 * 3;
    result.innerHTML = "<div>" + calculate + "</div>";
}

身体

Choose Width
<select id="width" name="height" onchange="calculate()">
    <option>1</option>
    <option>1</option>
</select>
<br/>
Choose Heiht
<select id="height" name="height" onchange="calculate()">
    <option>1</option>
    <option>2</option>      
</select>

Answer 1

你可以使用：

Choose Width:

<select id="width" name="height" onchange="calculate()">
    <option>1</option>
    <option>2</option>
</select>

    <br/>

   Choose Height

<select id="height" name="height" onchange="calculate()">
    <option>1</option>
    <option>2</option>      
</select>
<div id="result"></div>

和 javascript 应该是：

function calculate()
{
    var width = document.getElementById("width");
    width1 =  width.options[width.selectedIndex].text;  
    var height = document.getElementById("height");
    var height1 =  height.options[height.selectedIndex].text;    
    var calculate = width1*height1*3;
    var result = document.getElementById("result");
    result.innerHTML = calculate;
}

Answer 2

你应该result在你的 HTML 代码中有一个 div，然后你需要做 innerHTML 或 innerText 来放置你的结果
添加新标签（在你的 HTML 代码中）

<div id="result"></div>

现在在 JS 中更新这个 div 元素

var result = document.getElementById("result");
result.innerText = calculate;