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

          
	

          

          
	
					


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

          

          <html>
          <head>
          <title> 動態(tài)生成文體框演示 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          ="復(fù)選單選";

                      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">·動態(tài)生成文體框演示·div>td>
                       tr>
             
                       <tr>
                         <td colspan="2"> 請輸入您要添加的行數(shù)：
                           <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: 動態(tài)生成HTML表單
				2005-11-06 18:02 | alam
          
				
           不錯很實用  回復(fù)  更多評論
            
          
			
          
			
			
		
          
	
		
          
			
          
			# re: 動態(tài)生成HTML表單
				2006-04-10 10:18 | gdizqzq
          
				
          非常感謝

          delRow(this.parentElement.parentElement)

          function delRow(src){

                  src.parentElement.deleteRow(src.rowIndex);

              }

          

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

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








          








          

				

          









          
    







          
        
	




主站蜘蛛池模板：
滦平县|
板桥市|
抚宁县|
章丘市|
望都县|
莲花县|
成武县|
北辰区|
永安市|
香格里拉县|
蒲城县|
汉源县|
留坝县|
潮安县|
广安市|
清丰县|
鄱阳县|
馆陶县|
临沧市|
宁国市|
扶余县|
双柏县|
泉州市|
宁远县|
新河县|
北海市|
宁夏|
修文县|
兰西县|
上虞市|
洛川县|
长子县|
湘潭县|
定边县|
延庆县|
泰宁县|
平潭县|
丹凤县|
红安县|
益阳市|
尼玛县|