javascript - 使用文本框输入范围

Question

感谢您的宝贵时间!

我正在寻找这样的东西:Demo1。 -http://www.html5tutorial.info/html5-range.php

我有这个，但它不起作用。

<form>
 <input id="valR" max="65" min="1" step="1" type="range" value="1">
 <input id="rangeValue" type="text" min="1" max="65" value="1" oninput="this.form.valR.value=this.value"></form>
<div class="tesxsss2"><div id="taxa">Taxa FS Connect: $15.00</div>
<div id="shipping">Priority Mail (frete): 43.51</div>

谢谢大家!

Answer 1

您非常接近这段代码。唯一的问题是您将 oninput 属性放在了错误的元素上。

您想要对范围 slider 的变化使用react，而不是值框。

将其移至 valR 元素(并更改 id 以反射(reflect)我们现在正在填充 rangeValue)应该可以修复您的代码:

<form>
    <input id="valR" max="65" oninput="this.form.rangeValue.value=this.value" min="1" step="1" type="range" value="1">
    <input id="rangeValue" type="text" oninput="this.form.valR.value=this.value"  min="1" max="65" value="1" >
</form>

check out the pen here