Question

在JS里动态创建了button后，指定每行显示多少个button，显示不完的自动换行

在JS里动态创建了button，在页面上显示，button的个数由数组的长度决定，比方说数组长度是17，那么在页面上就能显示出17个button出来，但我想每一行仅显示6个button，其他没显示完的自动换行，怎么处理？
code:
var rm=new Array("北京","上海","广州","深圳","成都","长沙","杭州","天津","重庆","沈阳","哈尔滨","武汉","南京","西安","济南","合肥","福州");
var cityArray=new Array(rm);
function cityClick(num){
var g=function(id) {return document.getElementById(id);};
var val=this.cityArray[parseInt(num-1)].length;
var array=new Array();
array=this.cityArray[parseInt(num-1)];

if(!isNaN(val)) {
var box=g("box");
box.innerHTML="";
for(var i=0;i<val;i++) {
var chk=document.createElement("input");
chk.type="button";
chk.className="cityButton white";
chk.value=array[i];
box.appendChild(chk);
box.appendChild(document.createTextNode(" "));
//想在这里实现换行
}
}

Answer 1

var rm=new Array("北京","上海","广州","深圳","成都","长沙","杭州","天津","重庆","沈阳","哈尔滨","武汉","南京","西安","济南","合肥","福州");
var cityArray=new Array(rm);
function cityClick(num){
var g=function(id) {return document.getElementById(id);};
num = parseInt(num,10);
var val=this.cityArray[num-1].length;
var array=new Array();
array=this.cityArray[num-1];

if(!isNaN(val)) {
var box=g("box");
box.innerHTML="";
for(var i=0;i<val;i++) {
var chk=document.createElement("input");
chk.type="button";
chk.className="cityButton white";
chk.value=array[i];
box.appendChild(chk);
box.appendChild(document.createTextNode(" "));
//想在这里实现换行
if (num%6==0) {
var br = document.createElement("br");
box.appendChild(br);
}
}
}

追问

//想在这里实现换行
if (num%6==0) {
var br = document.createElement("br");
box.appendChild(br);
}
这样写不对，不应该是“num”的%6，应该是i，直接用i的话也不全对，if (i%6==0)这样会出现，第一个数组下标元素单独占了一行，改成if ((i+1)%6==0)就能正确显示了。不过还是谢谢你的回答，我的问题解决了