Javascript onclick事件沒有在Firefox中觸發

Question

我有一個在IE和Chrome中調用時可用的函數，但它在Firefox中不起作用。有

<table> 
    <thead> 

      <td scope="col">Balance remaining</td> 
      <td scope="col">Interest rate</td> 
      <td scope="col">Monthly payment</td> 
    </thead> 

    <tbody> 
<tr> 
      <td><input size=3 type=text id="balance1"></td> 
      <td><input size=1 type=text id="rate1"></td> 
      <td><input size=3 type=text id="monthly1"></td> 
     </tr> 
     <tr> 
      <td><input size=3 type=text id="balance2"></td> 
      <td><input size=1 type=text id="rate2"></td> 
      <td><input size=3 type=text id="monthly2"></td> 
     </tr> 
     <tr> 
      <td><input size=3 type=text id="balance3"></td> 
      <td><input size=1 type=text id="rate3"></td> 
      <td><input size=3 type=text id="monthly3"></td> 
     </tr> 
     <tr> 
      <td><input size=3 type=text id="balance4"></td> 
      <td><input size=1 type=text id="rate4"></td> 
      <td><input size=3 type=text id="monthly4"></td> 
     </tr> 
     <tr> 
      <td><input size=3 type=text id="balance5"></td> 
      <td><input size=1 type=text id="rate5"></td> 
      <td><input size=3 type=text id="monthly5"></td> 
     </tr> 
     <tr> 
      <td><input size=3 type=text id="balance6"></td> 
      <td><input size=1 type=text id="rate6"></td> 
      <td><input size=3 type=text id="monthly6"></td> 
     </tr> 
     <tr> 
     <td colspan="4"><input type=button class="button" value="Calculate" onclick="calcDebt();"></td> 
     </tr> 
     <tr class="con"> 
     <td colspan="4">Results</td> 
     </tr> 
     <tr> 
     <td colspan="1">Total debt:</td> 
     <td class="results" colspan="3"><label id="totalDebt">0</label></td> 
     </tr> 
     <tr> 
     <td colspan="1">Debt free in:</td> 
     <td class="results"><label id="totalMonths">0</label> months</td> 
     </tr> 
     <tr> 
     <td colspan="1">Total repayment:</td> 
     <td class="results" colspan="3">£<label id="totalRepayment">0</label></td> 
     </tr> 

任何理由爲什麼這應該不是工作在Firefox：這裏的功能：

function calcDebt(){ 
var totaldebt=0; 
var curBalance=0; 
var totRepay =0; 
var totMonths=0; 
var curMonthAmount=0; 
var curRate=0; 
for($i=1;$i<=6; $i++){ 
    curBalance = document.getElementById('balance'+$i).value; 
    curRate = document.getElementById('rate'+$i).value; 
    curMonthAmount=document.getElementById('monthly'+$i).value; 
    if(curBalance>0 && curMonthAmount>0 && curRate>0){ 
     var remainingBalance=curBalance; 
     var mRate=(curRate/100)/12; 
     var months=0; 
     var payment=curBalance*(mRate)/(1-Math.pow((1+mRate),(0))); 
     payment=Math.round(payment*100)/100; 
     while (remainingBalance>0) 
     { 
      months++; 
      remainingBalance=remainingBalance*(1 + mRate)-curMonthAmount; 
     } 
     totRepay = totRepay+(curMonthAmount*months); 
     totMonths += months; 
     totaldebt += (curBalance*1); 
    } 
} 
document.getElementById('totalDebt').innerText = totaldebt.toFixed(2); 
document.getElementById('conBalance').innerText = totaldebt.toFixed(2); 
document.getElementById('totalMonths').innerText = totMonths; 
document.getElementById('totalRepayment').innerText = totRepay.toFixed(2); 

document.getElementById('finalMonthly').value = ''; 
    document.getElementById('finalTerm').value = ''; 
    document.getElementById('finalPayment').value = ''; 

}

和HTML？使用Firebug我可以看到它告訴我conBalance在定義時未定義。

任何想法？我感謝您提供的任何幫助。

Answer 1

Firefox不支持innerText屬性，它在HTML5之前是非標準的。相反，它支持textContent屬性，該屬性在8年前已經標準化。所以你有這樣的代碼：

document.getElementById('conBalance').innerText = totaldebt.toFixed(2); 

簡單的修復就是改爲設置innerHTML屬性。

或者你可以有一個的setText功能，如：

function setText(el, text) { 
    if (typeof el.textContent == 'string') { 
    el.textContent = value; 
    } else if (typeof el.innerText == 'string') { 
    el.innerText = value; 
    } 
} 

然後調用它：

setText(document.getElementById('conBalance'), totaldebt.toFixed(2));