Question

我有一个javascript计算器，除了Internet Explorer之外，每个浏览器都可以正常运行。我需要知道为什么Internet Explorer在第14行给出了这个错误：“无法设置未定义或空引用的属性'值'。”

这是计算器代码：

<div class="parent box">
  Parent
  <div class="child box">
    Child
    <div class="child2 box">
      Another Child
    </div>
  </div>
</div>

Internet Explorer的调试器说，“无法在第14行设置未定义或空引用的属性'值'<meta http-equiv="x-ua-compatible" content="IE=10"> <script> function showpay() { "use strict"; if ((document.loanCalc.loan.value === null || document.loanCalc.loan.value.length === 0) || (document.loanCalc.months.value === null || document.loanCalc.months.value.length === 0) || (document.loanCalc.rate.value === null || document.loanCalc.rate.value.length === 0)) { document.loanCalc.pay.value = " "; } else { var princ = document.loanCalc.loan.value; var term = document.loanCalc.months.value; var intr = document.loanCalc.rate.value / 1200; document.loanCalc.pay.value = Math.round(princ * intr / (1 - (Math.pow(1 / (1 + intr), term)))); } // payment = principle * monthly interest/(1 - (1/(1+MonthlyInterest)*Months)) } </script> <form name=loanCalc method=POST> <table class="calculator"> <tr><td>Loan Amount</td><td align=right><input type=number onInput='showpay()' name=loan size=10 value="15000"></td></tr> <tr><td>Term in Months</td><td align=right><input type=number onInput='showpay()' name=months size=10 value="60"></td></tr> <tr><td>Interest Rate</td><td align=right><input type=number onInput='showpay()' name=rate size=10 value="1.99"></td></tr> <tr><td>Monthly Payment</td></tr> <tr><td align=left class=result><span>$</span><output name=pay>263</output></td></tr> </table> </form>

该代码可在Chrome，Safari和Firefox中正常运行。您可以在此页面上看到计算器：http://bloomcu.com/test-page/

为什么我在Internet Explorer中收到此错误？

Answer 1

这是一行更正（根据我的评论）

<tr><td>Loan Amount </td><td><input type="number" onInput="showpay()" name="loan" id="loan" size="10" value="15000" style="text-align:right"></td></tr>

如果你这样修理它们，它将更加朝着无处不在的方向发展。

Answer 2

你可以在IE上试试这个吗

<meta http-equiv="x-ua-compatible" content="IE=10">
<script>
document.loanCalc.pay = document.getElementById("pay");

function showpay() {
    "use strict";
    if ((document.loanCalc.loan.value === null || document.loanCalc.loan.value.length === 0) ||
        (document.loanCalc.months.value === null || document.loanCalc.months.value.length === 0)
        ||
        (document.loanCalc.rate.value === null || document.loanCalc.rate.value.length === 0)) { document.loanCalc.pay.innerHTML = " ";
    } else {
     var princ = document.loanCalc.loan.value;
     var term  = document.loanCalc.months.value;
     var intr   = document.loanCalc.rate.value / 1200;
     document.loanCalc.pay.innerHTML = Math.round(princ * intr / (1 - (Math.pow(1 / (1 + intr), term))));
}
// payment = principle * monthly interest/(1 - (1/(1+MonthlyInterest)*Months))
}

</script>


<form name=loanCalc method=POST>
<table class="calculator">

<tr><td>Loan Amount</td><td align=right><input type=number onInput='showpay()' name=loan size=10 value="15000"></td></tr>

<tr><td>Term in Months</td><td align=right><input type=number onInput='showpay()' name=months size=10 value="60"></td></tr>

<tr><td>Interest Rate</td><td align=right><input type=number onInput='showpay()' name=rate size=10 value="1.99"></td></tr>

<tr><td>Monthly Payment</td></tr>

<tr><td align=left class=result><span>$</span><span id='pay'>263</span></td></tr>

</table>
</form>

Answer 3

@ Z.Z。是正确的：资源管理器不支持<output>标记。因此，我将<output>替换为<input>，然后使用disabled="disabled"来阻止用户更改计算结果。

最终代码如下：

<meta http-equiv="x-ua-compatible" content="IE=10">
<script>

function showpay() {
"use strict";

if ((document.loanCalc.loan.value === null || document.loanCalc.loan.value.length === 0) ||
        (document.loanCalc.months.value === null || document.loanCalc.months.value.length === 0) ||
        (document.loanCalc.rate.value === null || document.loanCalc.rate.value.length === 0)) 
    { document.loanCalc.pay.value = " ";
} 

else {
     var princ = document.loanCalc.loan.value;
     var term  = document.loanCalc.months.value;
     var intr   = document.loanCalc.rate.value / 1200;
     document.loanCalc.pay.value = Math.round(princ * intr / (1 - (Math.pow(1 / (1 + intr), term))));
}
// payment = principle * monthly interest/(1 - (1/(1+MonthlyInterest)*Months))
}

</script>

<form name=loanCalc method=POST>
<table class="calculator">

<tr><td>Loan Amount</td><td><input type="number" onInput="showpay()" name="loan" id="loan" size="10" value="15000"></td></tr>

<tr><td>Term in Months</td><td><input type="number" onInput="showpay()" name="months" id="months" size="10" value="60"></td></tr>

<tr><td>Interest Rate</td><td><input type="number" onInput="showpay()" name="rate" id="rate" size="10" value="1.99"></td></tr>

<tr><td>Monthly Payment</td></tr>

<tr><td class=result><span>$</span><input name="pay" id="pay" value="263" disabled="disabled"></input></td></tr>

</table>
</form>

谢谢大家的帮助。

Internet Explorer：无法设置未定义或空引用的属性“值”

3 个答案: