html - HTMLテーブル内のセルの編集を許可するには?

Question

HTML テーブルで空白のセルを編集可能にするにはどうすればよいですか?

入力したテキストを保存して、後でテーブルを取得して表示できるようにしたいと考えています。

Answer 1

/** * このメソッドは、html ファイルに挿入するための html テーブル行を生成します。* 表の行を生成した後、このメソッドは * 次のレコードを挿入するために表の行の最後にプレースホルダーを追加します */ string generate_student_record_html(int record_num, int reg_num, string nic_num, string student_name, string gender, string Father_name) {

string new_record = "";
new_record.append("<tr>");

new_record.append("<td>");
new_record.append(to_string(record_num));
new_record.append("</td>");

new_record.append("<td>");
new_record.append(to_string(reg_num));
new_record.append("</td>");

new_record.append("<td>");
new_record.append(nic_num);
new_record.append("</td>");

new_record.append("<td>");
new_record.append(student_name);
new_record.append("</td>");

new_record.append("<td>");
new_record.append(gender);
new_record.append("</td>");

new_record.append("<td>");
new_record.append(father_name);
new_record.append("</td>");

new_record.append("</tr>");
new_record.append(PLACE_HOLDER); // for next record

return new_record;

}

Answer 2

contentEditable空白セルを含む任意のセルで属性を使用できます。

<td contentEditable>

ブラウザのサポートは非​​常に優れています。XHTML 構文を使用する場合は、属性を として記述しますcontenteditable="true"。

属性は、編集可能にするセルごとに個別に設定する必要があります。ただし、たとえばテーブル内のすべてのセルを編集可能にする場合は、属性に属性を設定するだけで十分tableです。

質問の 2 番目の段落は、他の問題を扱っており、回答するにはあいまいすぎるため、説明的なタイトルの下に別の質問として投稿する必要があります。通常、ユーザーが入力したデータはいくつかの方法で保存できます。たとえば、JavaScript を介して HTML ストレージ ( localStorage) を使用したり、Ajax 呼び出しまたはフォーム送信を介してサーバー側の処理にデータを送信したりします。