3

私はJavascriptの初心者ですが、ユーザーが数量を入力できる何かをWebサイトに実装しようとしており、入力すると小計が動的に更新されます。例: アイテムがそれぞれ 10 ドルで、ユーザーがテキスト フィールドに 5 と入力した場合、テキスト ボックスの横に 50 ドルと表示したいと思います。かなり単純な乗算ですが、Javascript で行う方法がわかりません。どうにかしてonKeyPressだと思いますか？ありがとう！

4

2 に答える 2

6

次の HTML を想定します。

<input type="text" id="numberField"/>
<span id="result"></span>

JavaScript:

window.onload = function() {
   var base = 10;
   var numberField = document.getElementById('numberField');
   numberField.onkeyup = numberField.onpaste = function() {
      if(this.value.length == 0) {
         document.getElementById('result').innerHTML = '';
         return;
      }
      var number = parseInt(this.value);
      if(isNaN(number)) return;
      document.getElementById('result').innerHTML = number * base;
   };
   numberField.onkeyup(); //could just as easily have been onpaste();
};

これが実際の例です。

于 2010-09-21T04:45:19.617 に答える
0

'onkeyup' および 'onpaste' イベントを処理して、キーボードおよびクリップボードの貼り付けイベントを介して変更を確実にキャプチャする必要があります。

<input id='myinput' />
<script>
  var myinput = document.getElementById('myinput');
  function changeHandler() {
    // here, you can access the input value with 'myinput.value' or 'this.value'
  }
  myinput.onkeyup = myinput.onpaste = changeHandler;
</script>

同様にgetElementById、要素のinnerHTML属性を使用して、結果を表示する場合に要素の内容を設定します。

于 2010-09-21T04:44:22.117 に答える