问：用 javascript 计算两个输入

Question

I have created the following code and on the last 3 inputs, I would like to calculate INPUT1 with INPUT2 and automatically get the result on INPUT3.我创建了以下代码，在最后 3 个输入上，我想用 INPUT2 计算 INPUT1 并自动在 INPUT3 上得到结果。

At the moment it's not working ofc, but if I change the INPUT3 to suddenly it works, but ofc I cannot get any data to be posted onto the database.目前它不工作，但如果我将 INPUT3 更改为突然工作，但我无法将任何数据发布到数据库中。 How can I output the result of the calculation without having to use a span tag?我怎样才能 output 计算结果而不必使用跨度标签？

Here is the Code.这是代码。

<script>
function divideBy() 
{ 
        num1 = document.getElementById("firstNumber").value;
        num2 = document.getElementById("secondNumber").value;
document.getElementById("result").innerHTML = num2 % num1;
}
</script>

<body>
    <div class="wrapper">
        <div class="container-fluid">
            <div class="row">
                <div class="col-md-12">
                    <div class="page-header">
                        <h2>Create new Route</h2>
                    </div>
                    <p>Enter the route<i><strong>"YYYY-MM-DD</i></p>
                    
                    <form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>" method="post">
                        <div class="form-group <?php echo (!empty($reason_err)) ? 'has-error' : ''; ?>">
                            <label>Reason</label>
                            <input type="text" name="reason" class="form-control" value="<?php echo $reason; ?>">
                            <span class="help-block"><?php echo $reason_err;?></span>
                        </div>
                        <div class="form-group <?php echo (!empty($startdest_err)) ? 'has-error' : ''; ?>">
                            <label>Start Destination</label>
                            <input type="text" name="startdest" class="form-control" value="<?php echo $startdest; ?>">
                            <span class="help-block"><?php echo $startdest_err;?></span>
                        </div>
                        <div class="form-group <?php echo (!empty($enddest_err)) ? 'has-error' : ''; ?>">
                            <label>End Destination</label>
                            <input type="text" name="enddest" class="form-control" value="<?php echo $enddest; ?>">
                            <span class="help-block"><?php echo $enddest_err;?></span>
                        </div>
                        <div class="form-group <?php echo (!empty($startkm_err)) ? 'has-error' : ''; ?>">
                            <label>INPUT 1</label>
                            <input type="text" name="startkm" class="form-control" id="firstNumber" value="<?php echo $startkm; ?>">
                            <span class="help-block"><?php echo $startkm_err;?></span>
                        </div>
                        <div class="form-group <?php echo (!empty($endkm_err)) ? 'has-error' : ''; ?>">
                            <label>INPUT 2</label>
                            <input type="text" name="endkm" class="form-control" id="secondNumber" onChange="divideBy()" value="<?php echo $endkm; ?>">
                            <span class="help-block"><?php echo $endkm_err;?></span>
                        </div>
                        <div class="form-group <?php echo (!empty($totalkm_err)) ? 'has-error' : ''; ?>">
                            <label>INPUT3</label>
                            <input type="text" name="totalkm" id="result" class="form-control" value="<?php echo $totalkm; ?>">
                            <span class="help-block"><?php echo $totalkm_err;?></span>
                        </div>
                        <input type="submit" class="btn btn-primary" value="Submit">
                        <a href="start.php" class="btn btn-default">Cancel</a>
                    </form>


If i change it from:
                        <div class="form-group <?php echo (!empty($totalkm_err)) ? 'has-error' : ''; ?>">
                            <label>Total Km</label>
                            <input type="text" name="totalkm" id="result" class="form-control" value="<?php echo $totalkm; ?>">
                            <span class="help-block"><?php echo $totalkm_err;?></span>
                        </div>

To this it works but ofc as I said no data is posted:

                        <div class="form-group <?php echo (!empty($totalkm_err)) ? 'has-error' : ''; ?>">
                            <label>Total Km</label>
                            <span type="text" name="totalkm" id="result" class="form-control" value="<?php echo $totalkm; ?>">
                            <span class="help-block"><?php echo $totalkm_err;?></span>
                        </div>```

Answer 1

@KIKO Software I solved after reading your comment a couple of times:) code that was changed "document.getElementById("result").value" and it solved the issue now upon changing the last input it automatically calculates the result from those two inputs mentioned before, and this was the result I was looking for. @KIKO Software 我在阅读了您的评论几次后解决了问题:) 更改了“document.getElementById("result").value”的代码现在在更改最后一个输入时解决了这个问题，它会自动计算这两个输入的结果之前提到的输入，这就是我正在寻找的结果。

<script>
function divideBy() 
{ 
        num1 = document.getElementById("firstNumber").value;
        num2 = document.getElementById("secondNumber").value;
document.getElementById("result").value = num2 % num1;
}
</script>

Thank you for your help:)谢谢您的帮助：）

问：用 javascript 计算两个输入

问题描述

1 个解决方案

解决方案1
1 2021-03-13 13:25:39

问：用 javascript 计算两个输入

问题描述

1 个解决方案

解决方案1 1 2021-03-13 13:25:39

解决方案1
1 2021-03-13 13:25:39