bars80080, youri: да, инпут в ячейке проще (т.к. не надо его позиционировать) 
yngwie19: я тут вчера вечером пытался "сваять":| Код |
<!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01//EN' 'http://www.w3.org/TR/html4/strict.dtd'>
<html>
<head>
<title>Edit table</title>
<style type='text/css'>
#table {margin:2cm auto;font-size:16px;border:1px solid #55A;background-color:#FFE}
.title {font-size:18px;color:#55A}
.edit {padding:2px;font-weight:bold;border:1px solid #5E5;color:#33E;background-color:#EFE}
</style>
<script type='text/javascript'>
var cell, clicked=false;
function init(){
var td, i, l;
document.onkeydown=endEditing;
var td=document.getElementById('table').getElementsByTagName('tbody')[0].getElementsByTagName('td');
for (i=0,l=td.length;i<l;i++){
if (!td[i].firstChild) td[i].appendChild(document.createTextNode(' '));
td[i].onclick=beginEditing;
}
}
function beginEditing(){
if (!clicked){
cell=this;
var input=document.createElement('input');
var textNode=this.firstChild;
input.className='edit';
textNode.data==' ' ? input.value='' : input.value=textNode.data;
textNode.data='';
this.appendChild(input);
input.focus();
clicked=true;
}
}
function endEditing(event){
if (cell!='undefined'){
var event=event||window.event;
var code=event.which||event.keyCode;
if (code==13){
var textNode=cell.firstChild;
var input=textNode.nextSibling;
input.value=='' ? textNode.data=' ' : textNode.data=input.value;
cell.removeChild(input);
clicked=false;
}
}
}
// need implement
function deleteSpace(text){
return text.replace(/^\s+|\s+$/g, '');
}
</script>
</head>
<body onload='init();'>
<table id='table' rules='all'>
<thead><tr><th class='title' colspan='4'>Title</th></tr></thead>
<tbody>
<tr><td> </td><td>bbb</td><td>ccc</td><td>ddd</td></tr>
<tr><td>eee</td><td></td><td>ggg</td><td>hhh</td></tr>
<tr><td>iii</td><td>jjj</td><td></td><td>lll</td></tr>
<tr><td>mmm</td><td>nnn</td><td>ooo</td><td></td></tr>
</tbody>
</table>
</body>
</html>
|
P.S. Народ, "покидайтесь помидорами" в скрипт - просто интересно, что там можно улучшить. |
)