我想基于输入的2维生成网格,然后提供一种通过发送对象来更新网格单元的方法:
updateCell = {index1,index2,value}
当我使用以下代码时,未相应设置单元格的:grID-column属性,grID-row属性.
function getCellID(row,col) { var name = "cell_" + row + "_" + col ; return name;}//entrypointfunction initGrID(rowSize,colSize) { var grID = document.getElementByID("mygrID"); for (i = 0; i < rowSize; i++) { for (j = 0; j < colSize; j++) { var data = { rowSize: rowSize,colSize: colSize,row: i,col: j }; var cell = initCell(data); grID.appendChild(cell); } }}function initCell(data) { var cell = document.createElement("div"); cell.ID = window.getCellID(data.row,data.col); cell.INNERHTML = "NotComputed"; cell.style["grID-column"] = data.row.toString() + "/" + data.rowSize.toString(); cell.style["grID-row"] = data.col.toString() + "/" + data.colSize.toString(); return cell; }
.grID-container{ display: grID; grID-gap:10px;}
<!DOCTYPE HTML><HTML><head> <link rel="stylesheet" type="text/CSS" href="grID.CSS" /> <script src="grID.Js"></script> <script> window.onload=function(){ window.initGrID(2,2); //the 2 inputs } </script></head><body> <div ID="mygrID"> </div></body></HTML>
最佳答案问题是在设置单元格样式时,我使用的是grID-column和grID-row属性.我通过使用grID-column-start,grID-column-end,grID-row-start,grID-row-end解决了它.
function initCell(data) { var cell = document.createElement("div"); cell.ID = window.getCellID(data.row,data.col); cell.INNERHTML = "NotComputed"; cell.style["grID-row-start"]=data.row; cell.style['grID-row-end']=data.row+1; cell.style['grID-column-start']=data.col; cell.style['grID-column-end']=data.col+1; return cell;}
总结 以上是内存溢出为你收集整理的javascript-无法统一显示网格 全部内容,希望文章能够帮你解决javascript-无法统一显示网格 所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)