2017-01-02 14 views
0

なぜ私のコードが機能しないのか分かりません。私は少しモジュロの電卓を作成しようとしている、私はかなりJavaScriptの新しいですし、このコードを思い付いた。JavaScriptを使用してモジュロ計算機を作成する際に問題が発生する

<!DOCTYPE html> 
<html> 
<head> 
    <title>Modulo Calculator</title> 
</head> 
<body> 
    Modulo Caculator 
    <script> 
     var x = myModulo(5,3); //enter numbers here 

     function myModulo(a,b) { 
      return a % b 
     }; 


    </script> 
</body> 
</html> 

2を返すはずですが、私はどこかで何か不足していることを知っていますが、何ですか?

+3

それは戻ってきます2.何を得ていますか? – charlietfl

+1

'Element.innerHTML = x'や' InputElement.value = x'のように 'x'をどこかで使わなければなりません。スタックオーバーフローへようこそ! – PHPglue

+0

Javascriptは主にHTMLの背後にある動的操作に使用され、コードはモジュロのシーン計算の背後で行い、2を返します。@PHPglueに加えて、結果を表示するにはHTMLを定義する必要があります。 Stack OverflowとInterwebを引用するための複数の例があります* Jeremy Clarkson * – Mouser

答えて

1

すべてのコードは正しいので、うまくいくはずです。実際には、ページロード時にJavaScriptを使用して結果を表示する必要があります(例)。

簡潔に言えば、JavaScript関数myModulo(5, 3)の結果が変数xに格納されています。これで返された整数値をどこに表示するか、DOM内で関数を呼び出すタイミングをブラウザに指示していません。 output IDを持っているあなたがしようとする場合があります

...

window.onload = function() { 
    var output = document.getElementById("output"); 
    output.innerHTML(myModulo(5, 3)); 
}; 

と(例えば)divまたはp素子を有する - すなわち<div id="output"></div>

0

あなたのコードだけで結構です。計算結果でビューを更新するだけです。

Mod Modulatorの例です。

<!DOCTYPE html> 
<html> 
<head> 
    <title>Modulo Calculator</title> 
</head> 
<body> 
    <h1>Modulo Caculator </h1> 
    <label for="dividend">Dividend</label> 
    <input id="dividend"> 
    <label for="divisor">Divisor</label> 
    <input id="divisor"> 
    <button id="calcBtn">Calculate</button> 
    <p>Result is: <span id="result"></span></p> 

    <script> 
     // Your modulo function 
     function myModulo(a,b) { 
      return a % b; 
     }; 

     // 
     var calcBtn = document.getElementById("calcBtn"); 
     var resultElement = document.getElementById("result"); 

     // Set onclick event to run the Mod and update the results 
     calcBtn.onclick = function(){ 
      // Get values 
      var dividend = document.getElementById("dividend").value; 
      var divisor = document.getElementById("divisor").value; 

      // Run Modulo function 
      var modResult = myModulo(dividend, divisor); 

      // Update Result 
      resultElement.innerText = modResult; 

     } 

    </script> 
</body> 
</html> 

このコードの説明我々は被除数と除数を格納する2つの入力(あなたの「a」と「b」)、トリガするボタンを作成し、すべての

  1. ファースト計算アクションおよび結果を表示するスパン要素が含まれています。
  2. 計算ボタンがクリックされるたびに実行されるonclickイベントリスナーを追加します。これは私たちが定義した関数を実行します。
  3. 計算ボタンをクリックすると、onclick関数は被除数と除数の両方の引数を取得し、myModulo関数を実行します。
  4. 結果が返された後、onclick関数が結果を返します。

これは、JSとHTMLのやりとりの詳細を理解するのに役立ちます。 幸運

関連する問題