1. excel怎麼做動態表格
方法/步驟
圖中數據表列舉了2013-2016年每個月的數據，我們要實現的是通過下拉菜單選擇年份，在圖表中自動生成對應年份的月數據圖表，效果如圖。
注意事項
在圖表中引用名稱時，名稱前面一定要加上工作表名兒，如本例中的：sheet1!月份
2. 如何動態生成一個HTML的TABLE
javascript，先不討論他是否能不能操縱資料庫，你說在html代碼中能看到js代碼，然後看到js進行資料庫操作了，然後有些人會利用這個幹些什麼？OK，然後俺來回答你的問題，你現在的設想，只能用ajax完成，當然很大部分也是js寫的，但操作資料庫部分還是要後台語言完成，而且ajax的js部分比較多，俺還是建議你去搜索一下ajax入門，這么點大地方也無法讓你明白ajax怎麼用的至於那個動態生成表格， var table=document.createElement("table");
table.setAttribute("border",0);
table.setAttribute("width","100%");
table.setAttribute("cellspacing",0);
table.setAttribute("cellpadding",0);
var head=table.createTHead();
var headrow=head.insertRow(0);
headrow.setAttribute("class","fixedHeaderTr");
headrow.insertCell(0).appendChild(document.createTextNode("報文編號"));
headrow.insertCell(1).appendChild(document.createTextNode("接受報文時間"));
headrow.insertCell(2).appendChild(document.createTextNode("源ID"));
headrow.insertCell(3).appendChild(document.createTextNode("目標ID"));
headrow.insertCell(4).appendChild(document.createTextNode("報文底層協議"));
headrow.insertCell(5).appendChild(document.createTextNode("報文備注信息"));
3. 用js和html動態生成n行n列表格
這是一個非常簡單使用的JS在線生成表格的代碼效果，通過JS功能代碼，直接輸入行數和列數就可以自動生成需要的表格，當然也可以擴展JS代碼實現生成文字的各種形式。
<html>
<head>
<title>Js動態生成表格</title>
<styletype="text/css">
table{font-size:14px;}
</style>
</head>
<body>
<scriptlanguage="javascript">
functiontableclick(name1,name2,name3){
Trow=name1.value;
Tcol=name2.value;
Tv=name3.value;
if((Trow=="")||(Tcol=="")||(Tv=="")){
alert("請將製作表格的條件填寫完整");
}
else{
r=parseInt(Trow);
c=parseInt(Tcol);
Table1(r,c,Tv);
}
}
functiontablevalue(a,ai,rows,col,str){
int1=a.length;
for(i=0;i<rows;++i){
for(j=0;j<col;++j){
if((j==0)&&(ai>=int1)){break;}
if(ai>=int1){
str=str+"<tdscope='col'></td>";
}
else{
if(j==0){
str=str+"<tr><thscope='col'>"+(a[ai++])+"</th>";
}
else{
if(j==col-1){
str=str+"<tdscope='col'>"+(a[ai++])+"</td>";
}
else{
str=str+"<tdscope='col'>"+(a[ai++])+"</td>";
}
}
}
}
str=str+"</tr>";
}
returnstr;
}
functionTable1(row,col,Str1){
varstr="";
a=newArray();
s=newString(Str1);
a=s.split("#");
int1=a.length;
ai=0;
if(col<=int1){
str=str+"<tablewidth='300'border='4'>";
for(i=0;i<col;++i){
if(i==0){
str=str+"<tr><thscope='col'>"+(a[ai++])+"</th>";
}
else{
if(i==(col-1)){
str=str+"<thscope='col'>"+(a[ai++])+"</th></tr>";
}
else{
str=str+"<thscope='col'>"+(a[ai++])+"</th>";
}
}
}
if(int1>col){
if(row>1){
str=tablevalue(a,ai,row-1,col,str);
}
}
str=str+"</table>";
aa.innerHTML=str;
}
}
</script>
<formname="form1"method="post"action="">
<p><b>行數：</b>
<inputname="name1"type="text"style="width:40px"value="4">
<b>列數：</b>
<inputname="name2"type="text"style="width:40px"value="4">
<inputtype="button"name="Submit3"value="生成表格"
onClick="tableclick(document.form1.name1,document.form1.name2,document.form1.name3)"></p>
<p><balign="top">表值：</b></p>
<p>
<inputname="name3"wrap="VIRTUAL"style="width:520px"
value="COL1#COL2#COL3#COL4#ROW1#A1#A2#a3#ROW2#B1#B2#B3#ROW3#C1#C2#C3">
</p>
</form>
<divid="aa"></div>
</body>
</html>
4. 表單輸入時如何動態生成表格
你這個問題問的怪怪的，還不知你用什麼語言呢?
看到你舉例所使用的標簽,我覺得不是ASP(VBSCRIPT),就是最簡單的那種JSP(沒有框架的那種)
那麼，就這兩種來說,代碼不是很相同,但是意思都一樣.
比如:你想做5行的表格,那麼，就用FOR循環,讓它循環5次,就可以了
標簽如下:
<table>
<%
for(int i=0;i<5;i++)
{
%>
<tr>
<td>……</td>
</tr>
<%
}
%>
</table>
其中，「……」部分你要放入的控制項，這樣，你做一行控制項就可以了，這樣，就可以循環出5行控制項，而取值的時候，用REQUEST.FORM("控制項名")；來獲取，不過，這時，你獲取到的是一個含有多個值的字元串，每個值之間是用「，」分割的，那麼，你用split方法，把字元串分解為字元串數組，在遍歷整個數組，將值存入資料庫就可以了！
試試吧，這個很簡單的
5. js如何實現點擊編輯按鈕，前端table表格行內指定td可修改。（table是動態生成的）
functionready(){varurl=base_path+"console/cfg/getBaseLayers/"+configId;$.ajax({url:url,type:"get",dataType:"json",success:function(result){//生成之前先清空tr,防止AJAX非同步載入重復生成$("#lottr").remove();varlength=result.length;for(vari=0;i<length;i++){varname=result[i].name;//服務名稱varalias=result[i].alias;//服務別名vartype=result[i].type;//服務類型varyear=result[i].year;//年份varurl=result[i].url;//服務地址varvisible=result[i].visible;//是否可見varid=result[i].id;//idserviceIdArray[i]=id;//此處將id塞給serviceIdArray，用於判斷是否添加。varstr="";if(visible==true){//生成trstr+='<trid="';str+=id;str+='"';str+='class="lot_box"><td>';str+=i+1;str+='</td><td>';str+=name;str+='</td><td>';str+=alias;str+='</td><td>';str+=type;str+='</td><td>';str+=year;str+='</td><td>';str+=url;str+='</td><td>';str+='<inputid="';str+=id;str+='"';str+='type="checkbox"checked="true"onchange="modifyService(this.id);"/>';str+='</td><td><inputid="';str+=id;str+='"';str+='type="button"value="編輯"onclick="editTd(this.id)"/>';str+='</td><td>';str+='<buttonclass="rosy"id="';str+=id;str+='"';str+='onclick="deleteService(this.id);">';str+='<imgsrc="static/img/del14.png"></button>';str+='</td></tr>';
}else{//生成trstr+='<trid="';str+=id;str+='"';str+='class="lot_box"><td>';str+=i+1;str+='</td><td>';str+=name;str+='</td><td>';str+=alias;str+='</td><td>';str+=type;str+='</td><td>';str+=year;str+='</td><td>';str+=url;str+='</td><td>';str+='<inputid="';str+=id;str+='"';str+='type="checkbox"onchange="modifyService(this.id);"/>';str+='</td><td><inputid="';str+=id;str+='"';str+='type="button"value="編輯"onclick="editTd(this.id)"/>';str+='</td><td>';str+='<buttonclass="rosy"id="';str+=id;str+='"';str+='onclick="deleteService(this.id);">';str+='<imgsrc="static/img/del14.png"></button>';str+='</td></tr>';
}var$tr=$(str);$("#lot").append($tr);
}
}
});
}
2）
//修改table行內元素(td)functioneditTd(id){//選中編輯按鈕的時候,把這行指定的幾個td變成文本框varb=$("input[type='button'][id='"+id+"']").parent();//tdvara=b.siblings();//td的兄弟節點if(a[1].children.length===0){a[1].innerHTML="<inputtype='text'value='"+a[1].innerText+"'/>";
}
if(a[2].children.length===0){a[2].innerHTML="<inputtype='text'value='"+a[2].innerText+"'/>";
}
if(a[3].children.length===0){a[3].innerHTML="<inputtype='text'value='"+a[3].innerText+"'/>";
}//將編輯改成保存和取消兩個按鈕b[0].innerHTML="<inputid='"+id+"'type='button'onclick='saveEditTd(this.id);'value='保存'/><inputtype='button'onclick='resertEditTd();'value='取消'/>";
//以下注掉的都是在網上找的參考。/*alert(a[0].getText());var$this=$(this).index();alert($this);*//*$('input[type="button"]').on('click',function(){var$this=$(this).parent().parent();//trready();});*//*var$=function(node){returntypeofnode=="string"?document.getElementById(node):node;}var$1=function(node,parent){varnd=document.createElement(node);if(parent)parent.appendChild(nd);returnnd;}/!**綁定事件流*!/varbind=function(obj,eventName,funcionName){if(obj.addEventListener){obj.addEventListener(eventName,funcionName,false);}elseif(obj.attachEvent){obj.attachEvent("on"+eventName,funcionName);}else{obj["on"+eventName]=funcionName;}};varfulltable=function(tbody,data){varpd=data.data;varcolumn=data.column;for(vari=0,len=data.rows;i<len;i++){vartr=$1("tr",tbody);varcd=pd[i];for(varj=0,jlen=column.length;j<jlen;j++){vartd=$1("td",tr);td.innerHTML=cd[column[j]];//innerText不兼容火狐，可以自己寫innerText和textContent的兼容，這里就直接用innerHTML了}}}varlittlehow_edit_table=function(tbody,ev){this.tbody=$(tbody);this.event=ev?ev:"click";//默認為單機事件this.init=function(data){//data可以是undefinedif(data){fulltable(this.tbody,data);}//調用可編輯this.edit();}this.edit=function(){vartds=this.tbody.getElementsByTagName("td");for(vari=0,len=tds.length;i<len;i++){bind(tds[i],this.event,this.click);}}this.click=function(){//alert(this.children.length);if(this.children.length>0)return;varv=this.innerHTML;this.innerHTML="";varinput=$1("input",this);input.type="text";input.value=v;input.focus();//游標聚集bind(input,"blur",blur);}varblur=function(){varv=this.value;this.parentNode.innerHTML=v;}}window.$$=function(id,ev){returnnewlittlehow_edit_table(id,ev);};*//*$('.editable').handleTable({"handleFirst":true,"cancel":"<spanclass='glyphiconglyphicon-remove'></span>","edit":"<spanclass='glyphiconglyphicon-edit'></span>","add":"<spanclass='glyphiconglyphicon-plus'></span>","save":"<spanclass='glyphiconglyphicon-saved'></span>","confirm":"<spanclass='glyphiconglyphicon-ok'></span>","operatePos":-1,"editableCols":[2,3,4],"order":["add","edit"],"saveCallback":function(data,isSuccess){//這里可以寫ajax內容，用於保存編輯後的內容//data:返回的數據//isSucess:方法，用於保存數據成功後，將可編輯狀態變為不可編輯狀態varflag=true;//ajax請求成功（保存數據成功），才回調isSuccess函數（修改保存狀態為編輯狀態）if(flag){isSuccess();alert(data+"保存成功");}else{alert(data+"保存失敗");}returntrue;},"addCallback":function(data,isSuccess){varflag=true;if(flag){isSuccess();alert(data+"增加成功");}else{alert(data+"增加失敗");}},"delCallback":function(isSuccess){varflag=true;if(flag){isSuccess();alert("刪除成功");}else{alert("刪除失敗");}}});*//*//dom創建文本框varinput=document.createElement("input");input.type="text";//得到當前的單元格varcurrentCell;functioneditCell(event){if(event==null){currentCell=window.event.srcElement;}else{currentCell=event.target;}//根據Dimmacro的建議修定下面的bug非常感謝if(currentCell.tagName=="TD"){//用單元格的值來填充文本框的值input.value=currentCell.innerHTML;//當文本框丟失焦點時調用lastinput.onblur=last;input.ondblclick=last;currentCell.innerHTML="";//把文本框加到當前單元格上.currentCell.appendChild(input);//根據liu_binq63的建議修定下面的bug非常感謝input.focus();}}functionlast(){//充文本框的值給當前單元格currentCell.innerHTML=input.value;}//最後為表格綁定處理方法.document.getElementById("table").ondblclick=editCell;*//*varttr=$(this).val()=="編輯"?"確定":"編輯";$(this).val(ttr);//按鈕被點擊後，在「編輯」和「確定」之間切換$(this).parent().siblings("td").each(function(){//獲取當前行的其他單元格varobj_text=$(this).find("input:text");//判斷單元格下是否有文本框if(!obj_text.length)//如果沒有文本框，則添加文本框使之可以編輯$(this).html("<inputtype='text'value='"+$(this).text()+"'>");else//如果已經存在文本框，則將其顯示為文本框修改的值$(this).html(obj_text.val());});*//*$('input[type="button"]').on('click',function(){var$this=$(this);var$td_arr=$this.parent().html('保存').prevAll('td');$.each($td_arr,function(){var$td=$(this);$td.html('<inputtype="text"value="'+$td.html()+'">');});});*/}
3）
//取消editTd編輯functionresertEditTd(){ready();//此方法是自己寫的，局部刷新頁面，重新載入數據
}
//保存editTd編輯functionsaveEditTd(id){vara=$("input[type='button'][id='"+id+"']").parent().siblings();//td的兄弟節點vartd_name=a[1].children[0].value;//服務名稱vartd_alias=a[2].children[0].value;//服務別名vartd_type=a[3].children[0].value;//服務類型varurl=base_path+"console/cfg/saveEditTd";$.ajax({url:url,type:"post",data:{"td_name":td_name,"td_alias":td_alias,"td_type":td_type,"id":id,"tpl":configId},datatype:"json",success:function(result){ready();//此方法是自己寫的，局部刷新頁面，重新載入數據
}
});
}
6. 如何在javascript中把函數的輸入內容和結果動態生成表格就是輸入兩個變數，點一個按鈕，自動生成個表格
feipigzi的代碼沒有給機會輸入行列數，而且使用的createElement和appendChild。我還是比較贊成使用較規范的insertRow和insertCell。
<script type="text/javascript">
window.onload = function() {
document.getElementById("add").onclick = function() {
var rows = parseInt(document.getElementById("rows").value),
cols = parseInt(document.getElementById("cols").value);
if(rows && cols) {
var table = document.createElement("table");
table.border = 1;
for(var r = 0; r < rows; r++) {
var row = table.insertRow(-1);
for(var c = 0; c < cols; c++) {
var cell = row.insertCell(-1);
cell.innerHTML = "行" + (r + 1) + "列" + (c + 1);
}
}
document.body.appendChild(table);
}
};
};
</script>
<input type="text" size="4" id="rows" value="" /> 行
<input type="text" size="4" id="cols" value="" /> 列
<input type="button" id="add" value="生成表格" />
7. 微信小程序怎麼創建動態表格
今天小編和大家一起學習的是如何在微信小程序中製作動態處理表格?一定有許多朋友很是期待吧，下面就是詳細的內容。
以上就是如何在微信小程序中製作動態處理表格的全部內容了
8. 關於JS動態創建表格
你這里有兩個問題，一個賦值的時候不用改用innerText，二個是多餘了兩次嵌套循環
functionautocreate(){
//創建table表格
vartable=document.createElement("table");
table.setAttribute("border","1");
table.setAttribute("background","red");
//獲取行數值
varline=document.getElementById("line").value;
//獲取列數值
varlist=document.getElementById("list").value;
for(vari=0;i<=line;i++){
//alert(line);
//創建tr
vartr=document.createElement("tr");
for(varj=0;j<=list;j++){
//alert(list);
//創建td
vartd=document.createElement("td");
td.innerHtml=i+"*"+j;
tr.appendChild(td);
}
table.appendChild(tr);
}
document.getElementById("d1").appendChild(table);
}
9. 用js實現動態添加表格數據
1、在頁面div中事先創建一個空白表格，可以根據需求而定。
10. html中如何使用js動態添加表格
一、動態載入表格
1.首先在html中為表格的添加位置設置id
即是在html的body標簽內部寫一個div標簽表明表格要添加到此div的內部。如下
<div id="tdl"><div>
2.在javascript中寫添加表格的語句
若在當前html文件中，則寫在<script>標簽內部，如
復制代碼 代碼如下:
<script type="text/javascript" >
document.getElementById("tbl").innerHTML="<table><tr><td></td></tr></table>" //此處添加的表格可根據自己需要創建
</script>
若是通過引入js文件，則在js文件（假設是test.js）中直接寫如下語句
復制代碼 代碼如下:
document.getElementById("tbl").innerHTML="<table><tr><td></td></tr></table>"
然後再引入自己的html文件
復制代碼 代碼如下:
<script type="text/javascript" src="test.js"></script>
二、 動態添加表格行
1.首先在html中為表格行的添加位置設置id，此位置必須是<tbody>內部（不是特別准確，但根據我的測試就得到此結論，有其他的方法請留言，謝謝），如下
復制代碼 代碼如下:
<table>
<thead></thead>
<tfoot><tfoot> //tfoot與thead是與tbody配套使用，但我在寫的時候，沒用也可以。
<tbody id="rows"></tbody>
</table>
[\s\S ]*\n
2.在javascript內容中，要先創建行和單元格，再在<.tbody>中添加行，如下
[code]
row=document.createElement("tr"); //創建行
td1=document.createElement("tr"); //創建單元格
td1.appendChild(document.createTextNode("content")); //為單元格添加內容
row.appendChild(td1); //將單元格添加到行內
document.getElementById("rows").append(row); //將行添加到<tbody>中