Internet Explorer oninput 功能不起作用答案

【问题标题】：Internet explorer oninput function not workingInternet Explorer oninput 功能不起作用
【发布时间】：2014-11-13 18:53:06
【问题描述】：

我的 IE 有问题。我在 JS 中创建了带有计算的表单，它使用输入类型范围。这是 jsfiddle 的链接：http://jsfiddle.net/vu378xh9/8/ 以及html代码：

<form action="" method="post" name="checkincome">
<label>Persons</label>
<input id="persons" name="persons" type="range" min="1" max="41" value="10" oninput="chckIncome();" />
<p id="personsvalue">10</p>
<br />
<label title="">Sale per person</label>
<input id="starters" name="starters" type="range" value="21.2" min="0.0" max="100.0" step="5" oninput="chckIncome();" />
<p id="startersvalue">21</p>
<br />
<p id="resultsvalue"></p>
<p style="text-align:center; padding-top:10px;">
    <input name="Reset" class="btn btn-large" type="reset" value="Reset" />
</p>

Javascript：

function chckIncome() {
var price = 49.9;
var regular = 199.9;
var form = document.forms.checkincome;
var x = parseFloat(form.persons.value);
var y = parseFloat(form.starters.value);
var z = 2.5;
var sum1 = (x * y) * price;
var sum2 = ((x * y) * z) * regular;
var sum3 = ((sum1 + sum2) * 0.25).toFixed(0);
sum3 = sum3.toString().replace(/\B(?=(\d{3})+(?!\d))/g, " ");
document.getElementById('personsvalue').innerHTML = form.persons.value;
document.getElementById('startersvalue').innerHTML = form.starters.value;
document.getElementById('resultsvalue').innerHTML = sum3 + " kr";
}

它适用于除 IE 之外的所有浏览器。有人知道如何解决吗？

【问题讨论】：

oninput 仅支持从 IE9 开始。您可以在旧版浏览器上使用onkeyup。
有趣的事情 - 我在 IE 11 上试过。同样的。 MaxArt 解决方案效果很好。

标签： javascript internet-explorer

【解决方案1】：

oninput 在较旧的 Internet Explorer 版本中不受支持。由于oninput 在您输入时触发，您可以使用其他事件来做几乎相同的事情。

由于您使用的是range，我建议您使用onmousemove。

<input type="range" id="testInput" onmousemove="test()">

<p id="demo"></p>

<script>
   function test() {
      var x = document.getElementById("testInput").value;
      document.getElementById("demo").innerHTML =  x;
   }
</script>

【讨论】：