자바 스크립트에서 테이블을 동적으로 삭제합니다.

자바 스크립트로 만든 테이블에서 행을 삭제하고 싶습니다. 이 페이지의 다른 게시물에서 코드를 시도했지만 해결하지는 못했습니다. 자바 스크립트에서 테이블을 동적으로 삭제합니다.

function value_pass() 
    { 
var Delete = document.createElement("input"); 
       Delete.type="button"; 
       Delete.name = "del" 
       Delete.value = "Delete"; 
       Delete.onclick = function(o) 
       { 
         var r = o.parentElement.parentElement;           
         document.getElementById("table").deleteRow(r.rowIndex); 
       } 

var order_no = document.getElementById("Order_no"); 
var quantity = document.getElementById("quantity"); 
var type = document.getElementById("Recipe"); 
var recipe = type.options[type.selectedIndex].text; 

var body1 = document.getElementsByTagName("body")[0]; 
var tbl = document.createElement("table"); 
tbl.setAttribute("id","table"); 
var tblbody = document.createElement("tbody"); 
tbl.setAttribute("border","2"); 

var col = document.createElement("td"); 

for (var j = 0; j < 1; j++) 
{ 
    var rows = document.createElement("tr"); 
    for (var i = 0; i < 4; i++) 
    { 
     var col1 = document.createElement("td"); 
     var col2 = document.createElement("td"); 
     var col3 = document.createElement("td"); 
     var col4 = document.createElement("td"); 
     var col5 = document.createElement("td"); 

     var col1text = document.createTextNode(order_no.value); 
     var col2text = document.createTextNode(recipe); 
     var col3text = document.createTextNode(quantity.value); 
     var col4text = document.createTextNode(); 

      //also want to put checked values in table row 


    } 
    col1.setAttribute("width","150"); 
    col2.setAttribute("width","150"); 
    col3.setAttribute("width","150"); 
    col4.setAttribute("width","150"); 


    col1.appendChild(col1text); 
    col2.appendChild(col2text); 
    col3.appendChild(col3text); 
    col4.appendChild(col4text); 
    col5.appendChild(Delete); 

    rows.appendChild(col1); 
    rows.appendChild(col2); 
    rows.appendChild(col3); 
    rows.appendChild(col4); 
    rows.appendChild(col5); 

    tblbody.appendChild(rows); 
} tbl.appendChild(tblbody); 
body1.appendChild(tbl); 
}

기능

는 HTML 의 버튼에 의해 호출됩니다 그것 또한

및 테이블 행에 넣어 체크 박스의 체크 값에 대해 알고 싶은 것을 주문 양식.

출처

2013-11-22 tanveer jan

삭제 버튼 위에서 언급되지만 함수이다 그것에서 일하지 않는다. 그리고 그래 내가 셀 말을 의미하는 두 번째 체크 박스는 –

당신은 사용할 수 있습니다

document.getElementById("myTable").deleteRow(0); //Where 0 is your row.

는 설명 : http://www.w3schools.com/jsref/met_table_deleterow.asp

편집 :

는, 현재의 행을 삭제하여 버튼이 설정하려면 : 그 함수에서 다음 코드로, onclick="deleteRow(this) :

function deleteRow(t) 
{ 
    var row = t.parentNode.parentNode; 
    document.getElementById("myTable").deleteRow(row.rowIndex); 
    console.log(row); 
}

출처

2013-11-22 15:02:10 Billy

값 포함하지만 난 버튼 –

편집 대답에 인접한 행을 삭제하려는 모든 행과 버튼이 있습니다. 보십시오 :-) – Billy

나는 자바 스크립트에서 테이블을 만들었고 테이블의 버튼도 자바 스크립트 함수로 만들어졌습니다. –

자바 스크립트에서 테이블을 동적으로 삭제합니다.

답변

관련 문제