如何使用按钮输入的金额和总金额重置特定输入字段？

Question

我有一个用于特定字段的工作总和和重置按钮，仅在不在表单标签内时才有效，但我需要将所有输入字段和金额按钮放在表单标签内，以便在提交之前进行验证。

过程应该是这样的：

-当客户点击指定金额的多个按钮时，总金额将显示在一个字段上。

- 当客户点击重置时，应重置特定字段。

但问题是，当字段上显示的总金额被重置时，客户再次单击按钮，金额只会添加到已清除的总金额中。但是当我删除表单标签时，重置按钮实际上正在工作，但提交按钮上的验证将不起作用。

那么，如果我不删除表单标签，还有什么替代方法呢？

我的代码和 jsfiddle 附在下面：

//Total Amount Sum Calculator

var sum = 0;

function f(val){

  sum += val;

  document.getElementById("deposit-total").value = sum;

}

function reset(){

  sum = 0;

  document.getElementById("deposit-total").value = 0;

}

//Automatic Comma

function FormatCurrency(ctrl) {

            //Check if arrow keys are pressed - we want to allow navigation around textbox using arrow keys

            if (event.keyCode == 37 || event.keyCode == 38 || event.keyCode == 39 || event.keyCode == 40) {

                return;

            }

            var val = ctrl.value;

            val = val.replace(/,/g, "")

            ctrl.value = "";

            val += '';

            x = val.split('.');

            x1 = x[0];

            x2 = x.length > 1 ? '.' + x[1] : '';

            var rgx = /(\d+)(\d{3})/;

            while (rgx.test(x1)) {

                x1 = x1.replace(rgx, '$1' + ',' + '$2');

            }

            ctrl.value = x1 + x2;

        }

//Restrict Characters (Numbers Only)

        function CheckNumeric() {

            return event.keyCode >= 48 && event.keyCode <= 57 || event.keyCode == 46;

        }

function submitForm() {

  return confirm('Do you really want to submit the form?');

}

Answer 1

这应该为您完成工作，您不能在函数中使用重置，因为默认情况下是从 js 使用的//Total Amount Sum Calculatorvar sum = 0;function f(val){&nbsp; sum += val;&nbsp; document.getElementById("deposit-total").value = sum;};function resets(){&nbsp; sum = 0;&nbsp; document.getElementById("deposit-total").value = 0;}//Automatic Commafunction FormatCurrency(ctrl) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; //Check if arrow keys are pressed - we want to allow navigation around textbox using arrow keys&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (event.keyCode == 37 || event.keyCode == 38 || event.keyCode == 39 || event.keyCode == 40) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; return;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var val = ctrl.value;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; val = val.replace(/,/g, "")&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ctrl.value = "";&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; val += '';&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; x = val.split('.');&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; x1 = x[0];&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; x2 = x.length > 1 ? '.' + x[1] : '';&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var rgx = /(\d+)(\d{3})/;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; while (rgx.test(x1)) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; x1 = x1.replace(rgx, '$1' + ',' + '$2');&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ctrl.value = x1 + x2;&nbsp; &nbsp; &nbsp; &nbsp; }//Restrict Characters (Numbers Only)&nbsp; &nbsp; &nbsp; &nbsp; function CheckNumeric() {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; return event.keyCode >= 48 && event.keyCode <= 57 || event.keyCode == 46;&nbsp; &nbsp; &nbsp; &nbsp; }function submitForm() {&nbsp; return confirm('Do you really want to submit the form?');}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><form><input type="number" class="input-char-amo" id="deposit-total" step="10000" min="10000" max="5000000" onkeypress="return CheckNumeric()"&nbsp; required>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <button type="reset" id="reset" class="correction" onclick="resets()">reset</button><br>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="amount-buttons-a">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <button type="button"&nbsp; id="1" onclick="f(10000)" class="btn-amount">10000</button>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <button type="button"&nbsp; id="2" onclick="f(20000)" class="btn-amount">20000</button>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <button type="button"&nbsp; id="3" onclick="f(50000)" class="btn-amount">50000</button>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="amount-buttons-b">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <button type="button"&nbsp; id="4" onclick="f(100000)" class="btn-amount">100000</button>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <button type="button"&nbsp; id="5" onclick="f(500000)" class="btn-amount">500000</button>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <button type="button"&nbsp; id="6" onclick="f(1000000)" class="btn-amount">1000000</button>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp;&nbsp;&nbsp; <p class="check-acc">input here</p>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <input type="text" class="input-check-acc" id="check-account" required>&nbsp; <br><button id="dep-submit" value="submit" type="submit" >신청 </button></form>

Answer 2

reset是 javascript 的保留关键字。如果您想查看所有保留字，请查看该链接。只需将 的函数名称更改reset()为另一个名称即可。