單選按鈕作為提交按鈕javascript？

Question

嗨，我正在用 JavaScript 開發計算器，只是為了鍛煉目的。 這是我的 HTML 代碼。

<h1 id="h1">Calculator</h1>
<input type="text" id="vaLue" name="val1">
<input type="submit" value="+" onclick="cal()" id="plus">
<input type="submit" value="-" onclick="cal()" id="minus">
<input type="submit" value="*" onclick="cal()" id="mul">
<input type="submit" value="/" onclick="cal()" id="devide">
<input type="submit" value="=" onclick="cal()" id="equal">

javascript代碼

    function cal(){

    var val1 = document.getElementById('vaLue').value;
    var errormessage = 'enter value';
    var plu= document.getElementById('plus').value;
    var minu= document.getElementById('minus').value;
    var mult= document.getElementById('mul').value;
    var div= document.getElementById('devide').value;
    var equ= document.getElementById('equal').value;

    if( val1.length == 0) {

            var error = document.getElementById('error');
            error.innerHTML= errormessage;
            return; 


    }

    if (val1.length != 0){
        var bt=document.getElementById('h1');
            calc= val1+plu;
    bt.innerHTML=calc;
    val1=null;
    }


}

我想將這些操作按鈕用作提交按鈕，根據它們的功能隨機使用。 我想將它們轉換為具有相同名稱屬性的單選按鈕，但我不知道如何使單選按鈕也充當提交按鈕。

如果你能告訴我如何定義變量值null。

提前感謝您的專家建議。

問候 Dheeraj

Answer 1

希望你正在尋找這樣的東西..

 var sum = 0; var inputVal = document.getElementById('vaLue'); function div() { var inputNum = parseFloat(inputVal.value) || 0; showResult(sum / inputNum); } function mul() { var inputNum = parseFloat(inputVal.value) || 0; showResult(sum * inputNum); } function sub() { var inputNum = parseFloat(inputVal.value) || 0; showResult(sum - inputNum); } function add() { var inputNum = parseFloat(inputVal.value) || 0; showResult(sum + inputNum); } function showResult(value) { sum = value document.getElementById('result').innerHTML = value; }

 #result { font-weight: bold; }

 <h1 id="h1">Calculator</h1> <input type="text" id="vaLue" name="val1"> <input type="submit" value="+" onclick="add()" id="plus"> <input type="submit" value="-" onclick="sub()" id="minus"> <input type="submit" value="*" onclick="mul()" id="mul"> <input type="submit" value="/" onclick="div()" id="devide"> <div id="result">0</div>

Answer 2

 var sum = 0; var inputVal = document.getElementById('vaLue'); function div() { var inputNum = parseFloat(inputVal.value) || 0; showResult(sum / inputNum); } function mul() { var inputNum = parseFloat(inputVal.value) || 0; showResult(sum * inputNum); } function sub() { var inputNum = parseFloat(inputVal.value) || 0; showResult(sum - inputNum); } function add() { var inputNum = parseFloat(inputVal.value) || 0; showResult(sum + inputNum); } function showResult(value) { sum = value document.getElementById('result').innerHTML = value; }

 #result { font-weight: bold; }

 <h1 id="h1">Calculator</h1> <input type="text" id="vaLue" name="val1"> <input type="submit" value="+" onclick="add()" id="plus"> <input type="submit" value="-" onclick="sub()" id="minus"> <input type="submit" value="*" onclick="mul()" id="mul"> <input type="submit" value="/" onclick="div()" id="devide"> <div id="result">0</div>