htmlとjavascriptを使用して2つの数字を追加する

私は2つの数字を追加しようとしています。ユーザーからの入力ですが、どこが間違っているのかわかりません。私が提出をクリックするたびに、ページが更新されます。htmlとjavascriptを使用して2つの数字を追加する

<!--Html --> 



    <html> 
     <body> 
      <div class="container-fluid"> 
       <header> 
        <h1>Business Registration Address Setup</h1> 
       </header> 

     <form> 
       <label>number 1</label> 
       <input type="text" name="number1" id="number1" placeholder="enter single digit number"> <br> 
       +<br> 
       <label>number 2</label> 
       <input type="text" name="number2" id="number2" placeholder="enter single digit number"><br> 
       <button type="submit" class="btn btn-info" onclick="submit1()">submit</button><br><br> 
       <div class="screen" id="screen1"></div> 

      </form> 

      </div> <!-- End Container--> 



     <footer> 

     </footer> 
      <script type="text/javascript"> 
       function submit1(){ 
       var a = document.getElementByID("number1").value; 
       var b = document.getElementByID("number2").value; 
       var c = a + b; 
      document.getElementByID("screen1").innerHTML=c; 
       } 
      </script> 

     </body> 
     </html>

出典

2016-06-15 Priyanka Maurya

document.getElementByID -------> document.getElementById var c=a+b ----------------------> var c = parseInt(a) + parseInt(b) button type="submit" -----------> button type="button"

@Mairajアーマドに述べたように、単に '' TYPE =からbutton'''' TYPE =を変更 – Hearty

ミスが1タイプ= "ボタン" 2、submit' 。documentgetElementById 3.整数を解析します。作業用URL：http://codepen.io/SESN/pen/xOOGZG – SESN

var c = parseInt(a) + parseInt(b);

<!DOCTYPE html> 
<html> 
<body> 

<div class="container-fluid"> 
    <header> 
     <h1>Business Registration Address Setup</h1> 
    </header> 

    <label>number 1</label> 
    <input type="text" name="number1" id="number1" placeholder="enter single digit number"> <br> 
    +<br> 
    <label>number 2</label> 
    <input type="text" name="number2" id="number2" placeholder="enter single digit number"><br> 
    <button type="button" class="btn btn-info" onclick="submit1()">submit</button><br><br> 
    <div class="screen" id="screen1"></div> 


</div> <!-- End Container--> 


<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script> 
<script> 
$(document).ready(function() { 

}); 
function submit1(){ 
    var a = document.getElementById("number1").value; 
    var b = document.getElementById("number2").value; 
    var c = parseInt(a) + parseInt(b); 
    document.getElementById("screen1").innerHTML=c; 
    } 
</script> 

</body> 
</html>

編集

出典

2016-06-15 07:15:06

あなたはtype="submit"を使用しているため、ページが最新表示されます。

をクリックしたときにjavascript functionに電話するには、type="button"を使用する必要があります。

<button type="button" class="btn btn-info" onclick="submit1()">submit</button><br><br>

はまた、あなたはそれがdocument.getElementByIdで機能していないdocument.getElementByIDを使用しています。

そして、あなたはまた、それ以外の値がちょうどconcatenatedないaddedなりますaddedするintに値をparseする必要があります。

出典

2016-06-15 07:04:00 Mairaj

htmlとjavascriptを使用して2つの数字を追加する

答えて

関連する問題