Based on the previous one, add left and right support for the direction keys.
In actual work, we will encounter such a situation. There are 100 data displayed on the page, and the user also hopes that he can change the data. The common method may be as follows,
A problem with this method is that the page is a bit slow to display, and if there are scroll bars, there will be some lag. Here is one of my solutions. When displayed, it is all TD and there is no input tag, as follows
When you click on one of the tds, the following will appear
When you click td, an input will be dynamically added to td and the value of td will be assigned to input. When your mouse leaves the input, the value of input will be assigned to td. It also supports Enter and up and down arrow keys to move right, up and down.
You can make some extensions to this and make some very practical functions (editing large batches of data, etc.). Not much to say, the source code is attached for reference only.
Online demo addresshttp://demo.jb51.net/js/td_input_edit/index.htm
Package download addresshttp://xiazai.jb51.net/201101/ yuanma/td_input_edit.rar