javascript - 使用jQuery/JS，我可以将JS对象的属性直接“绑定(bind)”到表单输入元素的值吗？

我正在为我所在城市的宠物寄宿企业建立在线预订系统，并且在如何有效执行此特定功能方面遇到了障碍。

快速了解用户流程...


给出了一些初步信息（客户信息，宠物信息等）。
用户选择2个日期；入住和退房天数。
该程序将计算客户端停留的天数，并将每一天扔入类“ Day”的构造函数中。每天都会生成一个...块，并显示给用户。还可能值得注意的是，所有Day对象都存储在一个数组中，该数组然后包含在妈妈类“ ReservationData”中……除了Day数组外，该类还保存一些与预订本身有关的元数据。


无论如何，我的问题是，一旦“ dayBlocks”被列出并显示给用户，用户就必须能够去检查在特定日期他们想要的宠物的各个“额外”。

因此，我将其分解为{ReservationData}
理想情况下，我希望对其进行设置，以便当用户选中复选框时，它会直接并立即相应地更改ReservationDataDaysExtraDeepArray中的相应变量。我内部的C程序员想将一个指针绑定到每个复选框，但是我（至少我认为）非常确定这对于jQuery是不可行的。

尽管我认为我已经很清楚地解释了它，但是下面是一些代码：

//Day Object/Class
function day(_date, _daynum) {
    this.date = new Date(_date);
    this.dayNum = _daynum;
    this.dayExtras = {
        'YH': false,  //<--- How can I directly manipulate
        'PP': false,  //<--- all of these guys via user-control
        'EE': false,  //<--- of corresponding/assigned
        'ST': false,  //<--- checkboxes?
        'PT': false,
        'TT15': false,
        'TT30': false,
        'TT45': false,
        'DC': false   //--- Or can I? :/
    };

    console.log("Day object created with date of " + day.date + " and day-number of " + day.dayNum + ".");

    this.getDayNum = function() { return this.dayNum; }
    this.getDayDate = function() { return this.date; }
}

这是我在这个网站上的第一个问题，但是我进行了很多搜索，但仍然迷路……谢谢大家！

最佳答案

假设复选框的名称与dayExtras对象中的键相对应，则可能会这样做。

//Day Object/Class
function day(_date, _daynum) {
    this.date = new Date(_date);
    this.dayNum = _daynum;
    this.dayExtras = {
        'YH': false,  //<--- How can I directly manipulate
        'PP': false,  //<--- all of these guys via user-control
        'EE': false,  //<--- of corresponding/assigned
        'ST': false,  //<--- checkboxes?
        'PT': false,
        'TT15': false,
        'TT30': false,
        'TT45': false,
        'DC': false   //--- Or can I? :/
    };

    console.log("Day object created with date of " + day.date + " and day-number of "+day.dayNum+".");

    this.getDayNum = function() { return this.dayNum; }
    this.getDayDate = function() { return this.date; }
    this.setDayExtras = function (key,val) {
      if(key in this.dayExtras){
        this.dayExtras[key] = val;
      }
    }
}

var myDay = new day(null,null);

$(document).on('change','#myForm input[type="checkbox"]', function () {
  myDay.setDayExtras(this.name,this.checked);
});