jquery およびコンテンツ変更コードに基づく高性能 td および入力切り替え_javascript スキル

前のキーに基づいて、方向キーの左右のサポートを追加します。

実際の仕事では、このような場面に遭遇することがあります。ページには 100 個のデータが表示されており、ユーザーはデータを変更できることを望んでいます。一般的な方法は次のとおりです。

この方法の問題は、ページの表示が少し遅く、スクロール バーがある場合は多少の遅れが生じることです。これは私の解決策の1つです。次のように、表示されるとすべてTDであり、inputタグがありません。

TDS の 1 つをクリックすると、次のものが表示されます

td をクリックすると、input が td に動的に追加され、td の値が input に割り当てられ、マウスが input から離れると、input の値が td に割り当てられます。また、Enter キーと上下の矢印キーで上下に移動することもできます。

これにいくつかの拡張を加えて、非常に実用的な機能 (大量のデータのバッチの編集など) を作成できます。あまり言うことはありませんが、ソースコードは参考のためにのみ添付されています。

オンライン デモのアドレス
http://demo.jb51.net/js/td_input_edit/index.htmパッケージのダウンロード アドレス
http://xiazai.jb51.net/201101/ yuanma/td_input_edit.rar