содержания изменения ячейки в таблицах usnig JavaScript

<html><head> 
<script type="text/javascript"> 
function addFunction(id) 
{ 
    cnt=parseInt(id.substr(7)); 
    var row=document.getElementById('driverDetails').insertRow(cnt+1); 
    var c1=row.insertCell(-1); 
    var c2=row.insertCell(-1); 
    var c3=row.insertCell(-1); 
    c1.innerHTML="row"+(cnt+1)+"colum1"; 
    c2.innerHTML="row"+(cnt+1)+"colum2"; 
    c3.innerHTML='<input type="button" id="addNew_'+(cnt+1)+'" name="addNew_'+(cnt+1)+'" value="Add New" onclick="addFunction(this.id)"/>'; 
} 
</script> 
</head><body> 
    <table> 
    <tr> 
     <td>row1 colum1</td> 
     <td>row1 colum2</td> 
     <td><input type="button" id="addNew_1" name="addNew_1" value="Add New" onclick="addFunction(this.id)"/></td> 
    </tr>   
    </table> 
</body> 
</html>

когда я нажимаю Добавить кнопку мы можем изменить содержание 3-й ячейки предыдущего рядасодержания изменения ячейки в таблицах usnig JavaScript

источник

2010-11-15 22francis

+1 закрыть. пожалуйста, приложите больше усилий для формулирования ваших вопросов и ознакомления с faq перед публикацией. –

можно изменить содержимое третьей ячейки предыдущей строки – 22francis

Здесь вы идете ...

<html><head> 
<script type="text/javascript"> 
function addFunction(id) 
{ 
    cnt=parseInt(id.substr(7)); 
    var row=document.getElementById('driverDetails').insertRow(cnt); 
    var c1=row.insertCell(-1); 
    var c2=row.insertCell(-1); 
    var c3=row.insertCell(-1); 
    c1.innerHTML="row"+(cnt+1)+"colum1"; 
    c2.innerHTML="row"+(cnt+1)+"colum2"; 
    c3.innerHTML='<input type="button" id="addNew_'+(cnt+1)+'" name="addNew_'+(cnt+1)+'" value="Add New" onclick="addFunction(this.id)"/>'; 
    document.getElementById('driverDetails').rows[cnt-1].deleteCell(2); 

} 
</script> 
</head><body> 
    <table id="driverDetails"> 
    <tr> 
     <td>row1 colum1</td> 
     <td>row1 colum2</td> 
     <td><input type="button" id="addNew_1" name="addNew_1" value="Add New" onclick="addFunction(this.id)"/></td> 
    </tr>   
    </table> 
</body> 
</html>

источник

2010-11-15 08:11:32

в onclick, вы можете использовать this.parentNode.innerHTML = ''; также .. как это onclick = "addFunction (this.id); this.parentNode.innerHTML = '';" –

Вот функция, которая делает то, что вы хотите, Я думаю.

function addFunction(id) { 
    var table = document.getElementById('driverDetails'); 

    var tr = document.createElement("TR"); 
    table.tBodies[0].appendChild(tr); 

    var rowCount = table.tBodies[0].rows.length; 
    var colCount = table.tBodies[0].rows[0].cells.length; 

    tr.innerHTML = 
    "<td>Row "+(rowCount)+", Col "+colCount+" 1</td>"+ 
    "<td>Row "+(rowCount)+", Col "+colCount+" 2</td>" 
}

Таким образом, вам не нужно добавлять третью ячейку и удалять ее каждый раз, когда вы создаете новую строку. Он будет просто добавлять строку каждый раз, когда вы нажимаете ту же кнопку.

(Если вы хотите добавить новую строку, ознакомьтесь с методом insertBefore() в DOM).

источник

2010-11-15 07:54:30 Ben

Нет необходимости заменять вызовы на 'insertRow()' и т. Д. Они отлично работают и работают в кросс-браузере. –

 
<html><head><script type="text/javascript"> 
function addFunction(id) 
{ cnt=parseInt(id.substr(7)); 
    document.getElementById('driverDetails').rows[cnt].deleteCell(2); 
    var row=document.getElementById('driverDetails').insertRow(cnt+1); 
    var c1=row.insertCell(-1); 
    var c2=row.insertCell(-1); 
    var c3=row.insertCell(-1); 
    c1.innerHTML="row"+(cnt+1)+"colum1"; 
    c2.innerHTML="row"+(cnt+1)+"colum2"; 
    c3.innerHTML='<input type="button" id="addNew_'+(cnt+1)+'" name="addNew_'+(cnt+1)+'" value="Add New" onclick="addFunction(this.id)"/>'; 
} 
</script> 
</head> 
<body> 
    <table> 
    <tr> 
     <td>row1 colum1</td> 
     <td>row1 colum2</td> 
     <td><input type="button" id="addNew_1" name="addNew_1" value="Add New" onclick="addFunction(this.id)"/></td> 
    </tr>
 
    </table> 
</body> 
</html>

благодаря Ронан Dejhero я изменить свой код, как это так, я получил ответ

источник

2010-11-15 08:23:11 22francis

Вам нужно нажать галочку под большим номером слева, чтобы принять его ответ. – Ben

Или с JQuery:

<html> 
<head> 
<script type="text/javascript" 
src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<script type="text/javascript"> 
function addFunction(id) { 
    var count = $('#box').find('tr').size()+1; 
    $('#box').append('<tr><td>row'+count+ 
' colum1</td><td>row'+count+' colum2</td></tr>'); 
} 
</script> 
</head> 
<body> 
<table id="box"> 
    <tr> 
    <td>row1 colum1</td> 
    <td>row1 colum2</td> 
    </tr> 
</table> 
<input type="button" value="Add New" onclick="addFunction()"/> 
</body> 
</html>

источник

2010-11-15 08:28:51 WolfRevoKcats

содержания изменения ячейки в таблицах usnig JavaScript

ответ

Смежные вопросы