Question

我有2个输入字段：

<input id="input1" etc />
<input id="answer" etc />

我想要做的是，当用户在“ input1”中输入数值（并将其限制为数字，没有字母或特殊字符）时，“ answer”输入字段显示该数字的0.0015％（例如，用户输入35000，因此在答案字段中将显示52.5，因为这是他们输入的数字的0.0015％。这将是实时完成的，没有提交或计算按钮。

我该怎么做？

Answer 1

您可以通过这种方式在第一个输入元素上添加 keyup 事件。尽管您在小提琴上使用了jQuery，但我使用了香草JS。我的fiddle，

exactextractr

function myFunction() {
  var inputVal = document.getElementById("input").value;
  var answerVal = document.getElementById("answer");
  var percentage = (0.0015/100) * parseInt(inputVal,10) * 100;
  if(inputVal !== ''){
     answerVal.value = (Math.round( percentage * 100 ) / 100).toFixed(1)
  }else{
  answerVal.value = '';
  }
}

Answer 2

您的代码几乎可以正常运行，但是您在给定的示例中无法正常工作，原因是您使用了JavaScript的 parseint 函数，该函数不允许十进制值，并且限制数字，您可以使用输入类型的数字。

		$(function(){
    
    $('#pointspossible').on('input', function() {
      calculate();
    });
    $('#pointsgiven').on('input', function() {
     calculate();
    });
    function calculate(){
        var pPos = $('#pointspossible').val(); 
        var pEarned = $('#pointsgiven').val();
        var perc="";
        if(isNaN(pPos) || isNaN(pEarned)){
            perc=" ";
           }else{
           perc = ((pEarned*pPos) / 100);
           }
        
        $('#pointsperc').val(perc);
    }

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type='number' id="pointspossible"/>
<input type='number' id="pointsgiven" />
<input type='text' id="pointsperc" disabled/>

JavaScript计算<input>字段中数字的百分比

2 个答案: