根据使用javascript或PHP的输入自动减去没有按钮点击的数字

时间:2014-06-04 05:01:21

标签: javascript php html

我有两个以上只能接受数字的输入,顶部有一个显示的数字。如何通过更改任何输入框上的值来减去我输入的数字?请帮忙。

 <p id='Answer'> 100 </p>
 <input type='number' max='10' min='0' name='num1'>
 <input type='number' max='5' min='0' name='num2'>

3 个答案:

答案 0 :(得分:2)

试试这段代码。它很酷。

<p id='Answer'> 100 </p>
<input type='number' max='10' min='0' id='num1' value="0">
<input type='number' max='5' min='0'  id='num2' value="0">

<script>

    $("#num2").keyup(function(){
        $("#answer").html('');
        var n1 = $("#num1").val();
        var n2 = $("#num2").val();
        var ans = n1 - n2;
        $("#answer").html(ans);
    }); 
    $("#num1").keyup(function(){
        $("#answer").html('');
        var n1 = $("#num1").val();
        var n2 = $("#num2").val();
        var ans = n1 - n2;
        $("#answer").html(ans);
    });
</script>

请检查此http://jsfiddle.net/P7FNs/2/

答案 1 :(得分:1)

好的,你的问题有点含糊不清。无论如何,我认为你想要以下。您希望num1自动从num2中减去并显示在id ='Answer'。

以下是jQuery中的代码。

$(".sub").focusout(function() {
  $("#answer").html('');
  var num1 = $("#num1").val();
  var num2 = $("#num2").val();
  var answer = num1 - num2;
  $("#answer").html(answer);
});

您可以在此处查看demo

如果您希望两个输入字段从100减去。以下是代码。

$(".sub").focusout(function() {
$("#answer").html('');
var num1 = $("#num1").val();
var num2 = $("#num2").val();
var answer = 100 - num1 - num2;
$("#answer").html(answer);
});

以下是demo

的链接

根据您在上次评论中提出的问题。从here下载jquery。现在将下载的脚本包含在标题中。或者只使用以下代码。

<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>

包含jquery后,您需要使用如下所述的.focusout代码

<script type="text/javascript">
$(document).ready(function() {
   $(".sub").focusout(function() {
     $("#answer").html('');
     var num1 = $("#num1").val();
     var num2 = $("#num2").val();
     var answer = 100 - num1 - num2;
     $("#answer").html(answer);
    });
});
</script>

答案 2 :(得分:0)

<p id='Answer'> 100 </p>
<input type='number' max='10' min='0' id='num1' value="0">
<input type='number' max='5' min='0'  id='num2' value="0">

<script>
    var input1_ = document.getElementById('num1');
    var input2_ = document.getElementById('num2');
    var answer = document.getElementById('Answer');
    function sub(){
        answer.innerHTML = (parseInt(input1_.value) - parseInt(input2_.value));
    }
    document.getElementById('num1').onkeyup = function () {
        sub();
    };
    document.getElementById('num2').onkeyup = function () {
        sub();
    };
</script>