使用JavaScript将输入字段循环到每个表列中

我想将输入字段添加到每个表列中，如下图所示。你们中有谁能给我一些建议，告诉我如何循环到每个表列的输入字段中？ 每一个帮助都将不胜感激！ 下面是我的代码片段，任何答案都非常感谢！！！谢谢你的帮助

函数displayCalendar（）{
var htmlContent=“”；
var FebNumberOfDays=“”；
var计数器=1；
var calCon=“”；
var dateNow=新日期（）；
var month=dateNow.getMonth（）；
var nextMonth=月份+1；
var prevMonth=第1个月；
var day=dateNow.getDate（）；
var year=dateNow.getFullYear（）；
如果（月份==1）{
如果（（年份%100！=0）和&（年份%4==0）| |（年份%400==0））{
FEB天数=29天；
}否则{
FEB天数=28天；
}
}
var monthNames=[“一月”、“二月”、“三月”、“四月”、“五月”、“六月”、“七月”、“八月”、“九月”、“十月”、“十一月”、“十二月”]；
var dayNames=[“星期日”、“星期一”、“星期二”、“星期三”、“星期四”、“星期五”、“星期六”]；
var dayPerMonth=[“31”、“+FEB天数+”、“31”、“30”、“30”、“31”、“31”、“30”、“31”、“30”、“30”、“30”、“31”]
var nextDate=新日期（下一个月+1，+年）；
var weekdays=nextDate.getDay（）；
var weekdays2=工作日
var numOfDays=dayPerMonth[月]；
而（工作日>0）{
htmlContent+=“”；
平日--；
}
（6号柜台）{
工作日2=0；
htmlContent+=“”；
}
如果（计数器==天）{
htmlContent+=“”+计数器+“”；
}否则{
htmlContent+=“”+计数器+“”；
}
工作日2++；
计数器++；
}
//这个代码不起作用
var calCon=“”
+月[月]+“”+年+“”；
钙调素+=”；
钙调素+=”；
钙调素+=”；
钙调素+=”；
钙调素+=”；
钙调素+=钙调素；
钙调素+=”；
document.getElementById（“日历”）.innerHTML=calCon；
var calendarBody=“”
+月[月]+“”+年+“”；
calendarBody+=“SunMonTues”+
“Wedsthursfri Sat”；
日历体+=“”；
calendarBody+=htmlContent；
日历体+=“”；
document.getElementById（“calendar”）.innerHTML=calendarBody；
}

.monthPre{
颜色：灰色；
文本对齐：居中；
}
蒙特诺{
边框：1px纯黑；
颜色：蓝色；
文本对齐：居中；
边框：1pxx纯黑；
高度：150像素；
宽度：150px；
}
dayNow先生{
边框：2件纯黑；
颜色：#FF0000；
文本对齐：居中；
}
.日历{
宽度：100%；
}
蒙特诺{
背景色：#000000；
颜色：#FFFFFF；
文本对齐：居中；
}
.姓名{
背景：黄色；
颜色：#000；
文本对齐：居中；
高度：100px；
宽度：100px；
}

JavaScript日历

只需在javascript的htmlContent中添加

函数displayCalendar（）{
var htmlContent=“”；
var FebNumberOfDays=“”；
var计数器=1；
var calCon=“”；
var dateNow=新日期（）；
var month=dateNow.getMonth（）；
var nextMonth=月份+1；
var prevMonth=第1个月；
var day=dateNow.getDate（）；
var year=dateNow.getFullYear（）；
如果（月份==1）{
如果（（年份%100！=0）和&（年份%4==0）| |（年份%400==0））{
FEB天数=29天；
}否则{
FEB天数=28天；
}
}
var monthNames=[“一月”、“二月”、“三月”、“四月”、“五月”、“六月”、“七月”、“八月”、“九月”、“十月”、“十一月”、“十二月”]；
var dayNames=[“星期日”、“星期一”、“星期二”、“星期三”、“星期四”、“星期五”、“星期六”]；
var dayPerMonth=[“31”、“+FEB天数+”、“31”、“30”、“30”、“31”、“31”、“30”、“31”、“30”、“30”、“30”、“31”]
var nextDate=新日期（下一个月+1，+年）；
var weekdays=nextDate.getDay（）；
var weekdays2=工作日
var numOfDays=dayPerMonth[月]；
而（工作日>0）{
htmlContent+=“”；
平日--；
}
（6号柜台）{
工作日2=0；
htmlContent+=“”；
}
如果（计数器==天）{
htmlContent+=“”+计数器+“”；
}否则{
htmlContent+=“”+计数器+“”；
}
工作日2++；
计数器++；
}
//这个代码不起作用
var calCon=“”
+月[月]+“”+年+“”；
钙调素+=”；
钙调素+=”；
钙调素+=”；
钙调素+=”；
钙调素+=”；
钙调素+=钙调素；
钙调素+=”；
document.getElementById（“日历”）.innerHTML=calCon；
var calendarBody=“”
+月[月]+“”+年+“”；
calendarBody+=“SunMonTues”+
“Wedsthursfri Sat”；
日历体+=“”；
calendarBody+=htmlContent；
日历体+=“”；
document.getElementById（“calendar”）.innerHTML=calendarBody；
}

.monthPre{
颜色：灰色；
文本对齐：居中；
}
蒙特诺{
边框：1px纯黑；
颜色：蓝色；
文本对齐：居中；
边框：1pxx纯黑；
高度：150像素；
宽度：150px；
}
dayNow先生{
边框：2件纯黑；
颜色：#FF0000；
文本对齐：居中；
}
.日历{
宽度：100%；
}
蒙特诺{
背景色：#000000；
颜色：#FFFFFF；
文本对齐：居中；
}
.姓名{
背景：黄色；
颜色：#000；
文本对齐：居中；
高度：100px；
宽度：100px；
}

JavaScript日历

你就快到了。您只需移动此块：

calCon = "<div id='hide'>" +
  monthNames[month] + " " + year + "";
calCon += "<label>";
calCon += "<input id='files' type='file' />";
calCon += "<span class='fa fa-plus'></span>";
calCon += "</label>";
calCon += calCon;
calCon += "<output class='img-responsive' id='result'/>";

之后，只需使用calCon

if (counter == day) {
  htmlContent += "<td class='dayNow'  onMouseOver='this.style.background=\"#FF0000\"; this.style.color=\"#FFFFFF\"' " +
    "onMouseOut='this.style.background=\"#FFFFFF\"; this.style.color=\"#00FF00\"'>" + counter + "</td>";
} else {
  htmlContent += "<td class='monthNow' onMouseOver='this.style.background=\"#FF0000\"'" +
    " onMouseOut='this.style.background=\"#FFFFFF\"'>" + calCon + counter + "</td>";
}

每一列还是每一个单元格？@axelaxel-Hmm，如上图所示。抱歉，如果我弄乱了列或单元格，我看不到输入字段的循环？还是你想做对一件？无论如何，您不应该对每个输入字段使用相同的ID。另外，您正在设置计算器的内部html两次！谢谢你在这里分享你的答案，它真的帮助我了解更多！

if (counter == day) {
  htmlContent += "<td class='dayNow'  onMouseOver='this.style.background=\"#FF0000\"; this.style.color=\"#FFFFFF\"' " +
    "onMouseOut='this.style.background=\"#FFFFFF\"; this.style.color=\"#00FF00\"'>" + counter + "</td>";
} else {
  htmlContent += "<td class='monthNow' onMouseOver='this.style.background=\"#FF0000\"'" +
    " onMouseOut='this.style.background=\"#FFFFFF\"'>" + calCon + counter + "</td>";
}