输出也输入HTML？

Question

我希望能够使用输出值的输入类型 =“范围”，但由于用户可能想要输入特定值，它也应该有一个输入类型 =“数字”。有没有办法在输入框中输出范围的值（或以任何其他方式？）。

这是我目前得到的代码（似乎无法让输出以某种方式正常工作）。

<form onsubmit="return false" oninput="litre.value = (height.valueAsNumber * width.valueAsNumber * depth.valueAsNumber) / 1000">

Height <input type="range" min="135" max="500" id="height" value="200" oninput="outputDimension(value)"/>
<output for="height">135</output>

Width <input type="range" min="135" max="500" id="width" value="250" oninput="outputUpdate(value)" />

Depth <input type="range" min="10" max="100" id="depth" value="45" oninput="outputUpdate(value)" />


<div id="sidebar">
    <p>Litre: 
        <output name="litre" for="height width depth">2250</output>
    </p>
</div>
</form>

Answer 1

也许这就是你的意思。检查下面的代码。 在框内输入数字后，按enter。

function updateTextInput(val) {
      document.getElementById('textInput').value=val; 
    }

function updateRange(val) {
      document.getElementById('range').value=val;
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

 <input id="range" type="range" name="rangeInput" min="0" max="100" onchange="updateTextInput(this.value);">                                                       
    <input type="text" id="textInput" value="" onchange="updateRange(this.value);">