Нажимаем кнопку - добавляется строка.
К примеру есть таблица:
<table name='tab1' border='1'align='left'> <tr> <td><input type='text' name='1'></td> <td><input type='checkbox' name='2'></td> <td><input type='textarea' name='3'></td> </tr> </table> И есть кнопочка: <input type='button' value='Ещё'> Как сделать так, чтобы при нажатии на кнопочку "Ещё", в таблице добавлялась ещё одна строка аналогичная той что уже есть? Выглядит достаточно просто, но мои скромные знания языка не позволяют этого сделать. Помогите, пожалста.=) |
var node = document.createElement('td');
node.innerHTML = 'Содержимое';
document.tabl.getElementsByTagName('tr')[0].appendChild(node);
|
Вставил ваш код так:
<script language="JavaScript">
function add(){
var node = document.createElement('td');
node.innerHTML = "<input type='text' name='1'>";
document.tabl.getElementsByTagName('tr')[0].appendChild(node);
}
</script>
И использовал так: <table name='tabl' border='1'align='left'> <tr> <td><input type='text' name='1'></td> </tr> </table> <input type='button' value='Ещё' onClick='add();'> Компилятор ругается: "Ошибка: 'document.tabl' - есть null или не является объектом" Спрашивается, где я накосячил?=( |
Эту строку так
<table id='tabl' border='1'align='left'> а ту в которой ошибка, так
document.getElementById('tabl').getElementsByTagName('tr')[0].appendChild(node);
|
Спасибо. В принципе заработало. Единственный минус, что код добавляет TD'шку (на сколько я разобрался в коде). А мне нужна новая строка в таблицу, то есть TR'ка.
|
Так?
<script language="JavaScript">
function add(){
var nodet = document.createElement('tr');
var node = document.createElement('td');
node.innerHTML = "<input type='text' name='1'>";
document.getElementById('tabl').appendChild(nodet);
nodet.appendChild(node);
}
</script> |
Теперь совсем ничего не добавляет и ошибок никаких не выдаёт.
|
Спасибо большое за помощь. Пока с тем что вы написали разбирался, написал немного по-другому.=)
<script language="JavaScript">
function add(){
var addTR = document.getElementById('tabl').insertRow(-1);
var addTD =addTR.insertCell(-1);
addTD.innerHTML = "<input type='text' name='1'>";
}
</script>
|
Как же не работает?
<html>
<head>
<script language="JavaScript">
function add(){
var nodet = document.createElement('tr');
var node = document.createElement('td');
node.innerHTML = "<input type='text' name='1'>";
document.getElementById('tabl').appendChild(nodet);
nodet.appendChild(node);
}
</script>
</head>
<body>
<table id='tabl' border='1'align='left'>
<tr>
<td><input type='text' name='1'></td>
</tr>
</table>
<input type='button' value='Ещё' onClick='add();'>
</body>
</html>
|
Я использую EditPlus как редактор в нём не сработало. В опере работает. Извенити, сразу не проверил.=) В IE'шнике тоже не сработало. Ещё раз спасибо за помощь.
|
| Часовой пояс GMT +3, время: 23:00. |