现在我想为tab键在最后TD进入以添加新行。
HTML:
Some Text over here
|
Some Text over here
|
Some Text over here
|
Some Text over here
|
Some Text over here
|
Some Text over here
|
Some Text over here
|
Some Text over here
|
Javscript:
function init()
{
var tables = document.getElementsByClassName("table");
var i;
for (i = 0; i < tables.length; i++)
{
makeTableEditable(tables[i]);
}
}
function makeTableEditable(table)
{
var rows = table.rows;
var r;
for (r = 0; r < rows.length; r++)
{
var cols = rows[r].cells;
var c;
for (c = 0; c < cols.length; c++)
{
var cell = cols[c];
var listener = makeEditListener(table, r, c);
cell.addEventListener("input", listener, false);
}
}
}
function makeEditListener(table, row, col)
{
return function(event)
{
var cell = getCellElement(table, row, col);
var text = cell.innerHTML.replace(/
$/, '');
var items = split(text);
if (items.length === 1)
{
// Text is a single element, so do nothing.
// Without this each keypress resets the focus.
return;
}
var i;
var r = row;
var c = col;
for (i = 0; i < items.length && r < table.rows.length; i++)
{
cell = getCellElement(table, r, c);
cell.innerHTML = items[i]; // doesn't escape HTML
c++;
if (c === table.rows[r].cells.length)
{
r++;
c = 0;
}
}
cell.focus();
};
}
function getCellElement(table, row, col)
{
// assume each cell contains a div with the text
return table.rows[row].cells[col].firstChild;
}
function split(str)
{
// use comma and whitespace as delimiters
return str.split(/,|\s|
/);
}
init();
$('td:last-child div').keydown(function(e) {
console.log('keyup called');
var code = e.keyCode || e.which;
if (code == '9') {
// var table=document.getElementById("table");
//table.insertRow(0);
alert('Pressed');
return false;
}
});
TAB键的作品,因为它会提醒你选项卡中的最后一个孩子后。但我不知道为什么insertRow不工作。从这里得到它http://www.w3schools.com/jsref/met_table_insertrow.asp
任何帮助或建议,将不胜感激!
+0
如果你从w3schools获得了一些东西,[这是第一个寻求帮助的地方](http://www.w3fools.com/)。 w3schools不以任何方式隶属于w3c.org,ECMA或任何其他官方实例,它只是一个半合法的骗局。 –