2013-12-16 53 views
2

當我得到用戶輸入並單擊提交時,它顯示x = undefined。如何解決這個問題? 這是我的代碼。或http://jsfiddle.net/L9LKc/如何在javascript中獲取x = undefined的騎乘版

<html> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
     <title>JS Assignment</title> 
     <script> 
     function changeCheckBox() { 
    try { 

     var max = document.myform.check.length; 
     var count = 0; 

     for (var i = 0; i < max; i++) { 
      if (document.myform.check[i].checked == true) { 
       count++; 
       serNoChecked = i; 
      } 
     } 
     if (count == 1) { 
      for (var i = 0; i < max; i++) { 
       if (document.myform.check[i].checked == false) { 
        document.myform.check[i].disabled = true; 
       } 
      } 
     } else if (count == 0) { 
      for (var i = 0; i < max; i++) { 
       document.myform.check[i].disabled = false; 
      } 
     } 

     if (null == max) return false; 
     if (count == 0) { 
      return true; 
     } else if (count > 0) { 
      return false; 
     } 

    } catch (e) { 
     alert(e.message); 
    } 
} 
</script> 
<script> 
    function arith(op) { 
    var n1 = parseInt(document.getElementById('num1').value,10); 
    var n2 = parseInt(document.getElementById('num2').value,10); 
    var newVal; 
    if (op == "Addition") { 
     newVal = n1+n2; 
    } else if (op == "Subtraction") { 
     newVal = n1-n2; 
    } else if (op == "Multiplication") { 
     newVal = n1*n2; 
    } else if (op == "Division") { 
     newVal = n1/n2; 
    } 

    var demoP=document.getElementById("demo") 
    demoP.innerHTML="x=" + newVal; 
} 
</script> 
    </head> 
    <body background="photo.jpg"> 
     <h3>Simple JavaScript Arithmetic Operations</h3> 
     <form name="myform" method="post" onsubmit="return arith()"> 
     Value 1 <input type ="text" id="num1"> <br><br> 
     Value 2 <input type="text" id="num2"> <br><br> 
     <input type="checkbox" name="check" value="Addition" id="check1" onclick="changeCheckBox(this.value)">Addition<br> 
     <input type="checkbox" name="check" value="Subtraction" id="check2" onclick="changeCheckBox(this.value)">Subtraction<br> 
     <input type="checkbox" name="check" value="Multiplication" id="check3" onclick="changeCheckBox(this.value)">Multiplication<br> 
     <input type="checkbox" name="check" value="Division" id="check4" onclick="changeCheckBox(this.value)">Division<br><br> 
     <input type="submit" value="Submit"> 
     </form> 
     <p id="demo"></p> 
    </body> 
</html> 
+0

你'op'是'undefined'因爲你當你調用'onsubmit =「時返回arith()' –

+0

Ya正在處理,但是我不能得到輸出結果。你可以檢查它嗎? –

回答

3

有很多錯誤,最重要的是你永遠不會分配op。我固定它(快速和骯髒的):

var op; 
function changeCheckBox(val) { 
    try { 
     var i; 
     var max = document.myform.check.length; 
     var count = 0; 
     op = val; 

     for (i = 0; i < max; i++) { 
      if (document.myform.check[i].checked === true) { 
       count++; 
       serNoChecked = i; 
      } 
     } 
     if (count === 1) { 
      for (i = 0; i < max; i++) { 
       if (document.myform.check[i].checked === false) { 
        document.myform.check[i].disabled = true; 
       } 
      } 
     } else if (count === 0) { 
      for (i = 0; i < max; i++) { 
       document.myform.check[i].disabled = false; 
      } 
     } 

     if (null === max) return false; 
     if (count === 0) { 
      return true; 
     } else if (count > 0) { 
      return false; 
     } 
    } catch (e) { 
     alert(e.message); 
    } 
} 

function arith() { 
    var n1 = parseInt(document.getElementById('num1').value, 10); 
    var n2 = parseInt(document.getElementById('num2').value, 10); 
    var newVal; 
    if (op == "Addition") { 
     newVal = n1 + n2; 
    } else if (op == "Subtraction") { 
     newVal = n1 - n2; 
    } else if (op == "Multiplication") { 
     newVal = n1 * n2; 
    } else if (op == "Division") { 
     newVal = n1/n2; 
    } 

    var demoP = document.getElementById("demo"); 
    demoP.innerHTML = "x=" + newVal; 
    return false; 
} 

小提琴:http://jsfiddle.net/Qr7U8/

+0

+1絕對正確。 –

+0

超棒的男人......哈特福給你! –

0

你得到不確定的,因爲如果你直接點擊不檢查任何操作提交,也不會計算x

在你的if else添加

else 
{ 
    alert("Check at least one operation"); 
} 

一部分。

查看已更新的fiddle。所以如果任何操作沒有被選擇,它將顯示一個警告,並且不會給出未定義的錯誤。

希望這會有所幫助。

P.S:你應該讓它們成爲單選按鈕而不是複選框。

而您正在調用方法arith()而不傳遞參數。所以op每次都是空的。因此它顯示警報。

+1

現在,它只顯示了一個lert如果我點擊任何複選框,然後點擊提交 –

+0

是的。它是因爲你正在調用方法arith()而不傳遞op參數。改變這一點。 @DineshKumar –

+0

現在,它沒有顯示警報。它正在處理,但我不能得到輸出。你可以檢查它嗎? –

1

「返回ARITH()」,所以沒有 「OP」 值ARITH(OP)通過和運算===未定義。

你需要獲得OP權值:

function getCheckedValue() { 
    var checks = document.myform.check; 

    for (var i = 0, len = checks.length; i < len; i++) { 
    if (checks[i].checked) return checks[i].value; 
    } 

    return false; 
} 

而且在功能ARITH(OP):

function arith(op) { 

    op = op || getCheckedValue(); 
     .... 

http://jsfiddle.net/rooseve/L9LKc/8/