jQuery更新事件处理程序不工作，我不知道为什么

jQuery on update event handlers aren't working and I can't figure out why

本文关键字：我不知道 为什么 工作 更新 事件处理 程序 jQuery      更新时间：2023-09-26

我试图为租金欠款做一个简单的计算器，这样只要用户输入他们的值，表的"结果"部分就会自动填充他们的结果。

当用户填写他们的详细信息时，结果部分保持和以前一样;然而，当我调试代码时，它告诉我没有错误。我很确定问题是在我的事件处理程序，但我不能找出在哪里/为什么。

代码如下:

$(document).ready(function () {
    $("#date1").datepicker({
    }).on("change", function (e) {
        dataBind();
    });
    $("#date2").datepicker({
    }).on("change", function (e) {
        dataBind();
    });
    $(document).on("change", "table input", function () {
        dataBind();
    });
    $("#r1").click(function () {
        dataBind();
    });
    $("#r2").click(function () {
        dataBind();
    });
    $("#r3").click(function () {
        dataBind();
    });
});

其中date1和date2是日期选择器，r1、r2和r3是单选按钮。dataBind是执行计算和更新结果字段的函数:

var dataBind = function () {
    var config = {
        dueDate: new Date($('#date1').val()),
        untilDate: new Date($('#date2').val()),
        rentAmount: $('#rentAmount').val(),
        dueDateResult: $('#date1'),
        calcUntilResult: $('#date2')
    };
    t = new workings(config);

    $("#dueDateFirstMissed").html(t.dueDateFirstPaymentResult);
    $("#untilDateCalculate").html((t.calculatedUntil));
    $("#numberDays").html(t.numberDays.toFixed(0));
    $("#numberperiods").html((t.numberPeriods));
    $("#amountDue").html("£" + (t.amountDue.toFixed(2)));
    $("#dailyRate").html("£" + ((t.dailyRate).toFixed(2)));
};

这里有一个小提琴的链接，尽管记住我还没有完成计算!

任何帮助/指针将非常感激!

Thanks in advance

在您的JSFiddle中，您在getNumberPeriods函数中有一个错字，其中firsyDate.getMonth()应该是firstDate.getMonth()。纠正这个问题似乎解决了问题。

作为旁注，我还会记住有人在您的"到期租金金额"字段中输入的值不是数字的可能性。当前这样做会在UI中产生NaN。

祝你好运!

在function下面分配的变量中有语法错误 

function getNumberPeriods() {
        var periodLength = getPeriodLength();
        var calcDate = (options.untilDate);
        var calcYear = calcDate.getFullYear();
        var calcMonth = calcDate.getMonth();
        var calcDay = calcDate.getDate();
        var firstDate = (options.dueDate);
        var firstYear = firstDate.getFullYear();
        var firstMonth = firstDate.getMonth(); //this was firsyDate.getMonth()
        var firstDay = firstDate.getDate();
        .....
}

你可以改变你的值，当你填满所有的3个字段，否则你会得到NaN在你的结果，你可以这样做:

var dataBind = function () {
    if($("#date1").val()!="" && $("#date2").val()!="" && $('#rentAmount').val()!="") 
    { //If all the fields have values then get it done
    var config = {
        dueDate: new Date($('#date1').val()),
        untilDate: new Date($('#date2').val()),
        rentAmount: $('#rentAmount').val(),
        dueDateResult: $('#date1'),
        calcUntilResult: $('#date2')
    };
    console.log(config);
    t = new workings(config);
    $("#dueDateFirstMissed").html(t.dueDateFirstPaymentResult);
    $("#untilDateCalculate").html((t.calculatedUntil));
    $("#numberDays").html(t.numberDays.toFixed(0));
    $("#numberperiods").html((t.numberPeriods));
    $("#amountDue").html("£" + (t.amountDue.toFixed(2)));
    $("#dailyRate").html("£" + ((t.dailyRate).toFixed(2)));
    }
};

注意:你还没有给你的rentAmount文本框顶部的id 只是添加它太

<

更新演示/strong>

相关文章：