基于单元格属性阻塞表的单元格-Javascript

基于单元格属性阻塞表的单元格-Javascript,javascript,jquery,dom,Javascript,Jquery,Dom,我有两张桌子。一个用于Monthdoff表的日期,一个用于Monthdoff表的月份。对于每个月单元格,我都添加了属性“data test”,其中包含该特定月份的天数 我试图添加一个函数,将Month_表中选定单元格的“data test”属性与Dofm_表中每个单元格的“value”属性进行比较。用户不能单击Dofm_表中任何“value”属性高于Month_表中所选单元格的“data val”属性的单元格 例如,如果用户单击Month_表中的Feb,他们应该只能单击Dofm_表中的单元格1-

我有两张桌子。一个用于Monthdoff表的日期,一个用于Monthdoff表的月份。对于每个月单元格,我都添加了属性“data test”,其中包含该特定月份的天数

我试图添加一个函数,将Month_表中选定单元格的“data test”属性与Dofm_表中每个单元格的“value”属性进行比较。用户不能单击Dofm_表中任何“value”属性高于Month_表中所选单元格的“data val”属性的单元格

例如,如果用户单击Month_表中的Feb,他们应该只能单击Dofm_表中的单元格1-28

以下是我迄今为止所做的工作:

 function MonthDofmBlocks() {

        //check if dofm checkboxes has been checked. If so, block the days calender. Vice versa.
        var days = 0;
        var checkboxMonthCells = document.querySelectorAll('#Month_Table td');

        checkboxMonthCells.forEach(c => c.addEventListener('click', event => {

            days = 0;

            for (var i = 0; i < checkboxMonthCells.length; i++) {

                var NofD = parseInt($(checkboxMonthCells[i]).attr('data-test'));

                if (checkboxMonthCells[i].onclick) {
                    if (days < NofD)
                        days = NofD;
                }
            }
            var DofM = $("#Dofm_Table td").each(function (index, value) {
                var day = DofM.attr("value") + 1;

            });


        }));

    }
    MonthDofmBlocks();

这里是JSFiddle:

如果您只想取消选择某一天的功能,您可以在他们单击某一天时检查所选月份的限制。这里有一个简单的例子

$("#Dofm_Table td").click(function (event) {
  var valueOfDay = parseInt($(this).attr("value"));

  //All months have at least 28 days, so we can just allow any day below that.
  if (valueOfDay > 27) {
    //find the month cell that is selected and read its value.
    var monthDayLimit = parseInt($("#Dofm_Table td.on").attr("data-test"));

    if (valueOfDay > monthDayLimit) {
        return false;
    }
  }

  $(this).toggleClass('on');
});

你能提供一个小的吗?抱歉,我第一次问这个问题时应该加上它。现在已经添加了。