<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">  
<HTML>  
<HEAD>  
<TITLE> New Document </TITLE>  
<META NAME="Generator" CONTENT="EditPlus">  
<META NAME="Author" CONTENT="">  
<META NAME="Keywords" CONTENT="">  
<META NAME="Description" CONTENT="">  
<script>  
 var i=0   function b(){
    
 var m=obj.parentElement.parentElement.rowIndex+1;
 
    m.removeAttribute("readOnly"); 
      
 }
  
 function insert_row(){ 
 
 
  i ++   
  R = tbl.insertRow()   
  C = R.insertCell()   
  C.innerHTML = "第"+i+"个文件"   
  C = R.insertCell()   
  C.innerHTML = "<input value='123' readOnly ondblclick='b();'>"
    C = R.insertCell()   
  C.innerHTML = "<input value='123' readonly>"  
    C = R.insertCell()   
  C.innerHTML = "<input value='123' readonly>"  
    C = R.insertCell()   
  C.innerHTML = "<input value='123' readonly>"  
    C = R.insertCell()   
  C.innerHTML = "<input value='123' readonly>"  
  C = R.insertCell()   
  C.innerHTML = "项目动态"  
  C = R.insertCell()   
  C.innerHTML = "<input >"  
 }   
 function deleteRow(obj){   
   var flag=confirm("请问要确认删除吗?") 
   if(flag){
 // alert(obj.parentElement.parentElement.rowIndex+1);   
  tbl.deleteRow(obj.parentElement.parentElement.rowIndex);
              }
 }   
</script>  
</HEAD>  
  
<BODY>    <form>
<input type='button'  value='删除' onclick='deleteRow(this)'>
  </form>
<input type="button" value="插入" onclick="insert_row()">    
  
<table name='tbl' id="tbl" border="1" width=300>    
</table>    
</BODY>  
</HTML>   
我现在的表格能够自动添加 也可以删除。  但是我想实现 选中哪行,就自动删除哪行。请各位帮忙,小弟诚惶诚恐。
人在线。

解决方案 »

  1.   

    function tabDel(){
    $("#tbl tr").each( function(i,n){
    $(n).click( function(){
    alert("第"+i+"行")
    })
    })
    }
      

  2.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">  
    <HTML>  
    <HEAD>  
    <TITLE> New Document </TITLE>  
    <META NAME="Generator" CONTENT="EditPlus">  
    <META NAME="Author" CONTENT="">  
    <META NAME="Keywords" CONTENT="">  
    <META NAME="Description" CONTENT="">  
    <script>  
     var i=0   function b(){
         var m=obj.parentElement.parentElement.rowIndex+1;
        m.removeAttribute("readOnly"); 
     }
     function insert_row(){ 
      i ++   
      R = tbl.insertRow()   
      C = R.insertCell()   
      C.innerHTML = "第"+i+"个文件"   
      C = R.insertCell()   
      C.innerHTML = "<input value='123' readOnly ondblclick='b();'>"
        C = R.insertCell()   
      C.innerHTML = "<input value='123' readonly>"  
        C = R.insertCell()   
      C.innerHTML = "<input value='123' readonly>"  
        C = R.insertCell()   
      C.innerHTML = "<input value='123' readonly>"  
        C = R.insertCell()   
      C.innerHTML = "<input value='123' readonly>"  
      C = R.insertCell()   
      C.innerHTML = "项目动态"  
      C = R.insertCell()   
      C.innerHTML = "<input >"  
     }
     
     
     var tr;
     var tbl = document.getElementById('tbl');
     tbl.onclick = function(event){
      var target = event.scrElement || event.target;
      if(target.tagName == 'TR'){
      tr = target;
      }else if(getSpecialParentByTagName(target, 'TR')){
      tr = getSpecialParentByTagName(target, 'TR');
      }
    }
    function getSpecialParentByTagName(elem, tag){
    var el;
    if(elem.tagName !== 'BODY' && elem.parentNode.tagName === tag){
    el = elem.parentNode;
    }else if(elem.tagName !== 'BODY'){
    el = hasParentsType(elem.parentNode, tag);
    }else{
    el = null;
    }
    return el;
    }
     function deleteRow(obj){   
    var flag=confirm("请问要确认删除吗?") 
    if(flag){
    tbl.removeChild(tr);
    }
     }   
    </script>  
    </HEAD>  
      
    <BODY>    <form>
    <input type='button'  value='删除' onclick='deleteRow(this)'>
      </form>
    <input type="button" value="插入" onclick="insert_row()">    
      
    <table name='tbl' id="tbl" border="1" width=300>    
    </table>    
    </BODY>  
    </HTML>  
      

  3.   

    先点下想删除的行,再点删除就能删掉了。<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">  
    <HTML>  
    <HEAD>  
    <TITLE> New Document </TITLE>  
    <META NAME="Generator" CONTENT="EditPlus">  
    <META NAME="Author" CONTENT="">  
    <META NAME="Keywords" CONTENT="">  
    <META NAME="Description" CONTENT="">  
    <script>  
     var i=0   function b(){
         var m=obj.parentElement.parentElement.rowIndex+1;
        m.removeAttribute("readOnly"); 
     }
     function insert_row(){ 
      i ++   
      R = tbl.insertRow()   
      C = R.insertCell()   
      C.innerHTML = "第"+i+"个文件"   
      C = R.insertCell()   
      C.innerHTML = "<input value='123' readOnly ondblclick='b();'>"
        C = R.insertCell()   
      C.innerHTML = "<input value='123' readonly>"  
        C = R.insertCell()   
      C.innerHTML = "<input value='123' readonly>"  
        C = R.insertCell()   
      C.innerHTML = "<input value='123' readonly>"  
        C = R.insertCell()   
      C.innerHTML = "<input value='123' readonly>"  
      C = R.insertCell()   
      C.innerHTML = "项目动态"  
      C = R.insertCell()   
      C.innerHTML = "<input >"  
     }
     
     
     var tr;
     var tbl = document.getElementById('tbl');
     tbl.onclick = function(event){
      var target = event.scrElement || event.target;
      if(target.tagName == 'TR'){
      tr = target;
      }else if(getSpecialParentByTagName(target, 'TR')){
      tr = getSpecialParentByTagName(target, 'TR');
      }
    }
    function getSpecialParentByTagName(elem, tag){
    var el;
    if(elem.tagName !== 'BODY' && elem.parentNode.tagName === tag){
    el = elem.parentNode;
    }else if(elem.tagName !== 'BODY'){
    el = hasParentsType(elem.parentNode, tag);
    }else{
    el = null;
    }
    return el;
    }
     function deleteRow(obj){   
    var flag=confirm("请问要确认删除吗?") 
    if(flag && tr){
    tbl.removeChild(tr);
    }else if(flag && !tr){
    alert(‘请先选择要删除的行!');
    }
     }   
    </script>  
    </HEAD>  
      
    <BODY>    <form>
    <input type='button'  value='删除' onclick='deleteRow(this)'>
      </form>
    <input type="button" value="插入" onclick="insert_row()">    
      
    <table name='tbl' id="tbl" border="1" width=300>    
    </table>    
    </BODY>  
    </HTML>  
      

  4.   


    function insert_row(){ 
     
     
      i ++   
      R = tbl.insertRow()   
      C = R.insertCell()   
      C.innerHTML = "第"+i+"个文件"   
      C = R.insertCell()  
      C.innerHTML="<input id="+i+" type='checkbox' />"; 
       C = R.insertCell() 
      C.innerHTML = "<input value='123' readOnly ondblclick='b();'>"
        C = R.insertCell()   
      C.innerHTML = "<input value='123' readonly>"  
        C = R.insertCell()   
      C.innerHTML = "<input value='123' readonly>"  
        C = R.insertCell()   
      C.innerHTML = "<input value='123' readonly>"  
        C = R.insertCell()   
      C.innerHTML = "<input value='123' readonly>"  
      C = R.insertCell()   
      C.innerHTML = "项目动态"  
      C = R.insertCell()   
      C.innerHTML = "<input >"  
     }   
     function deleteRow(obj){   
    //   var flag=confirm("请问要确认删除吗?") 
    //   if(flag){
     // alert(obj.parentElement.parentElement.rowIndex+1);   
       $(":checkbox").each(function () {
            if($(this).attr("checked"))
            {
               var o=this.parentElement.parentElement;
               $(o).remove();
            }
        });
      //            }
     }   
      

  5.   

    有点小错误,重新发下<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">  
    <HTML>  
    <HEAD>  
    <TITLE> New Document </TITLE>  
    <META NAME="Generator" CONTENT="EditPlus">  
    <META NAME="Author" CONTENT="">  
    <META NAME="Keywords" CONTENT="">  
    <META NAME="Description" CONTENT="">  </HEAD>  
      
    <BODY>    <form>
    <input type='button'  value='删除' onclick='deleteRow(this)'>
      </form>
    <input type="button" value="插入" onclick="insert_row()">    
      
    <table name='tbl' id="tbl" border="1" width=300>    
    <tr>
    <td>td1</td>
    </tr>
    <tr>
    <td>td2</td>
    </tr>
    </table>    
    <script>  
     var i=0   function b(){
         var m=obj.parentElement.parentElement.rowIndex+1;
        m.removeAttribute("readOnly"); 
     }
     function insert_row(){ 
      i ++   
      R = tbl.insertRow()   
      C = R.insertCell()   
      C.innerHTML = "第"+i+"个文件"   
      C = R.insertCell()   
      C.innerHTML = "<input value='123' readOnly ondblclick='b();'>"
        C = R.insertCell()   
      C.innerHTML = "<input value='123' readonly>"  
        C = R.insertCell()   
      C.innerHTML = "<input value='123' readonly>"  
        C = R.insertCell()   
      C.innerHTML = "<input value='123' readonly>"  
        C = R.insertCell()   
      C.innerHTML = "<input value='123' readonly>"  
      C = R.insertCell()   
      C.innerHTML = "项目动态"  
      C = R.insertCell()   
      C.innerHTML = "<input >"  
     }
     
     
     var tr;
     var tbl = document.getElementById('tbl');
     tbl.onclick = function(event){
      var target = event.scrElement || event.target;
      if(target.tagName == 'TR'){
      tr = target;
      }else if(getSpecialParentByTagName(target, 'TR')){
      tr = getSpecialParentByTagName(target, 'TR');
      }
    }
    function getSpecialParentByTagName(elem, tag){
    var el;
    if(elem.tagName !== 'BODY' && elem.parentNode.tagName === tag){
    el = elem.parentNode;
    }else if(elem.tagName !== 'BODY'){
    el = hasParentsType(elem.parentNode, tag);
    }else{
    el = null;
    }
    return el;
    }
     function deleteRow(obj){   
    var flag=confirm("请问要确认删除吗?") 
    if(flag && tr){
    tr.parentNode.removeChild(tr);
    }
     }   
    </script>  
    </BODY>  
    </HTML>  
      

  6.   

    直接双击你要删除的行就可以了
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">  
    <HTML>  
    <HEAD>  
    <TITLE> New Document </TITLE>  
    <META NAME="Generator" CONTENT="EditPlus">  
    <META NAME="Author" CONTENT="">  
    <META NAME="Keywords" CONTENT="">  
    <META NAME="Description" CONTENT="">  
    <script>  
     var i=0   function b(){
        
         var m=obj.parentElement.parentElement.rowIndex+1;
     
        m.removeAttribute("readOnly"); 
              
     }
      
     function insert_row(){ 
     
     
      i ++   
      R = tbl.insertRow();
      R.id='tr'+i;
      C = R.insertCell()   
      C.innerHTML = "第"+i+"个文件"   
      C = R.insertCell()   
      C.innerHTML = "<input value='123' readOnly ondblclick='b();'>"
        C = R.insertCell()   
      C.innerHTML = "<input value='123' readonly>"  
        C = R.insertCell()   
      C.innerHTML = "<input value='123' readonly>"  
        C = R.insertCell()   
      C.innerHTML = "<input value='123' readonly>"  
        C = R.insertCell()   
      C.innerHTML = "<input value='123' readonly>"  
      C = R.insertCell()   
      C.innerHTML = "项目动态"  
      C = R.insertCell()   
      C.innerHTML = "<input >"
      
    var ele=document.getElementById('tr'+i);
    ele.ondblclick=function(){
    deleteRow(ele);
    }
     }   
     function deleteRow(obj){   
       var flag=confirm("请问要确认删除吗?") 
       if(flag){
     // alert(obj.parentElement.parentElement.rowIndex+1);   
    obj.parentNode.removeChild(obj);
                  }
     }   
    </script>  
    </HEAD>  
      
    <BODY>  <input type="button" value="插入" onclick="insert_row()">    
      
    <table name='tbl' id="tbl" border="1" width=300>    
    </table>    
    </BODY>  
    </HTML>