隨筆-179 
評論-666 
文章-29 
trackbacks-0

          
	

          

          
	
					


          
	
	         前段時間在做設票系統，瞎搞一會，用JavaScript搞了一些有趣的東西，因為投票的條數不定，一個題目有不定條選項，要實現一次把投票題目與不定數目選項的投票項目一次性添加進數據庫，因些就想了用JavaScript寫了一個動態生成的HTML的“文體框”。然后用數組把所有值寫入數據庫。現在就把它做成一個簡單的演示例子放在這里吧：

          

          <html>
          <head>
          <title> 動態生成文體框演示 title>


          <script language="javascript">

                        function createitem()
                        {
                           var m=document.form1;
                           var val=m.max.value;
                           for (i=0;i<val;i++)
                           {
                         r          =tab.insertRow()

                      c          =r.insertCell('nowrap align:Left') 
                      c.innerHTML          ="復選單選";

                      c          =r.insertCell() 
                      c.innerHTML          ="·";
                 }
                 m.max.value          ="";
              }

                        function resetDate()
                        {
                           var m=document.form1;
                 m.action          ="butt.html";
                 m.submit();
              }

          script>
          head>

          <body>
          <form name="form1" method=post action="">
          <table name="tab" id="tab">
                       <tr>
                         <td colspan="2"> <div align="center">·動態生成文體框演示·div>td>
                       tr>
             
                       <tr>
                         <td colspan="2"> 請輸入您要添加的行數：
                           <input type="text" name="max" size="5" value=""> 
                           <input type="button" name="add" value="添加" onclick="createitem()"> 
                           <input type="button" name="reset" value="重置" onclick="resetDate()">
                         td>
                       tr>
          table>
          form>
          body>

          html>


                  后來又做了一些其它的嘗試演示，下面這個程序是增加了刪除HTML表單的例子：

          

          <script language="javascript">
                        var curRow=null;
                        function selectRow(tr1){
                            if(curRow)
                  curRow.bgColor          ="#FFFFFF";
                  tr1.bgColor          ="e7e7e7";
                  curRow          =tr1;
              }

                        function addRow(src){
                            var newrow = src.insertRow(src.rows.length-1);
                  newrow.attachEvent(          "onclick",function(){selectRow(newrow);});
                  newrow.height          =20;
                            var i=5;
                            while(i--){
                                var newcell = newrow.insertCell();
                                switch(i){
                                    case 0: newcell.innerHTML= '<input type="button" onClick="javascript:delRow(this.parentElement.parentElement)" value="刪除此行">';break;
                                    default: newcell.innerHTML='&nbsp;';break;
                      }
                  }
              }

                        function delRow(src){
                  src.parentElement.deleteRow(src.rowIndex);
              }
          script>

          <table id="tabe" width="100%"  border="1" >
                      <tr>
                        <th width="20%">編號th>
                        <th width="20%">姓名th>
                        <th width="20%">性別th>
                        <th width="20%">年齡th>
                        <th width="20%">民族th>
                      tr>

                      <tr id="lastRow" onClick="addRow(this.parentElement)">
                        <td> 1td>
                        <td> 2td>
                        <td> 3td>
                        <td> 4td>
                        <td> 5td>
                      tr>

          table>



          
	
          posted on 2005-10-27 17:49 Alpha 閱讀(8814) 評論(7)  編輯  收藏  所屬分類: Java J2EE JSP 
          

          







          
	    
    


          
評論:

          
	

		
          
			
          
			# re: 動態生成HTML表單
				2005-11-06 18:02 | alam
          
				
           不錯很實用  回復  更多評論
            
          
			
          
			
			
		
          
	
		
          
			
          
			# re: 動態生成HTML表單
				2006-04-10 10:18 | gdizqzq
          
				
          非常感謝

          delRow(this.parentElement.parentElement)

          function delRow(src){

                  src.parentElement.deleteRow(src.rowIndex);

              }

          

          受益匪淺  回復  更多評論
            
          
			
          
			
			
		
          
	
		
          
			
          
			# re: 動態生成HTML表單
				2007-04-13 14:50 | 賭東道
          
				
          為什么總是說我的max為空對象啊  回復  更多評論
            
          
			
          
			
			
		
          
	
		
          
			
          
			# re: 動態生成HTML表單
				2007-04-25 21:03 | gfds
          
				
          gfd  回復  更多評論
            
          
			
          
			
			
		
          
	
		
          
			
          
			# re: 動態生成HTML表單
				2008-10-15 11:12 |  gsb
          
				
          頂

            回復  更多評論
            
          
			
          
			
			
		
          
	
		
          
			
          
			# re: 動態生成HTML表單
				2010-03-16 13:17 | busifox
          
				
          挺不錯的  回復  更多評論
            
          
			
          
			
			
		
          
	
		
          
			
          
			# re: 動態生成HTML表單
				2014-05-04 16:47 | 55
          
				
          87444  回復  更多評論
            
          
			
          
			
			
		
          
	








          








          

				

          

          
	
		
          
			


          
	

          今日記一事，明日悟一理，積久而成學。
          

          

          

			
          
	
          
		
          <2005年10月>
          
	
          日一二三四五六
          2526272829301
          2345678
          9101112131415
          16171819202122
          23242526272829
          303112345
          

          

          
			

          常用鏈接
          


          留言簿(32)
          




		
          隨筆分類(182)
          
		
				
			
	
		
          文章分類(39)
          
		
				
			
	
		
          相冊
          
		
				
			
	
		
          友情鏈接
          
		
				
			
	
		
          我的地盤
          
		
				
            
			
				
          
			
	
		
          技術文檔
          
		
				
			
	




          搜索
          

            
	
          • 
		
          •  
	
            • 

          


          積分與排名
          

            
	
          • 
		積分 -
		1332331
	
          • 
		排名 -
		20
	
            • 

          


          最新隨筆
          



          最新評論
	
          

          
	
			
		

          


          閱讀排行榜
          



          評論排行榜
          


          
	

          





51La


          
    







          
        
	




主站蜘蛛池模板：
治多县|
阿克陶县|
大新县|
哈尔滨市|
惠来县|
抚远县|
兴仁县|
潮安县|
博野县|
九江县|
南昌市|
双流县|
河西区|
中阳县|
陈巴尔虎旗|
手游|
南昌市|
涡阳县|
建平县|
罗城|
阿荣旗|
马公市|
文昌市|
灌南县|
和田县|
阆中市|
闽侯县|
苍溪县|
石狮市|
毕节市|
阳高县|
防城港市|
沭阳县|
桂东县|
泽普县|
密云县|
绩溪县|
宣威市|
大理市|
紫阳县|
苗栗市|