parseInt（x，10）导致最大调用堆栈/太多的递归错误

Question

我有一个简单的JS函数，它根据2个输入值更新一个隐藏的文本框。

在更新隐藏的文本框之前，我使用parseInt（x，10）来验证输入是否为数字，如果没有，则将该值设置为0。

为什么这会导致过多的递归错误？

  $(function () {
        $("#payment-form").on("submit",function (e) {

            var xDollars = $("#dollars").val();
            var xCents = $("#cents").val();
            //collect our form dollar and cents values, set to 0 if not int
            if (parseInt(xDollars, 10) == "NaN") {
                $("#dollars").val("0");
            }
            if (parseInt(xCents, 10) == "NaN") {
                $("#cents").val("00");
            }

            //join dollars and cents and submit transaction amount
            $("#TransactionAmount").val(xDollars + "." + xCents);
            $("#payment-form").submit();
            return true;
        });
    });

Answer 1

不是parseInt()会引起您的问题，而是这样的：

        $("#payment-form").submit();

您正在从“提交”处理程序内部触发“提交”操作。

如果验证成功后仅返回true ，则表单应正常提交。

Answer 2

这是因为jQuery不区分无论您是通过提交表单submit事件或通过.submit()方法。 因此，如果你使用jQuery的$.submit()它会触发一个submit手动事件。

请改用vanilla-js。 根据表单提交算法 ，如果您使用.submit() ，则不会触发该事件：

如果未设置来自submit()方法的 Submit标志，则在form处引发一个简单的事件 ，该事件会冒泡并且可以取消，名为submit 。 如果阻止了事件的默认操作（即，如果事件被取消），则中止这些步骤。 否则，请继续（实际上，默认操作是执行提交）。

因此，这不会有问题：

document.getElementById('payment-form').submit();

但是在这种情况下，您只需删除$("#payment-form").submit(); 。 如果您不取消活动，则应自动提交表单。