以下のコードを使用して編集ボックスを挿入し、入力時に完全に機能しているMySQLデータベースに結果を保存します
編集する表のセルは次のようになります
<tr><td class="edit tbl_tracking 92"></td></tr>
<tr><td class="edit tbl_tracking 96"></td></tr>
<tr><td class="edit tbl_tracking 101"></td></tr>
Enter キーを押して保存が完了したら、次の編集ボックスをフォーカスして自動的に選択したいと考えています。そのため、Enter キーを押した後の各エントリの後、次のエントリが選択されてフォーカスされます。各行には他のセルがありますが、div または edit が必要になりました
どんな助けでも素晴らしいでしょう。
$(document).ready(function () {
$('td.edit').click(function () {
$('.ajax').html($('.ajax input').val());
$('.ajax').removeClass('ajax');
$(this).addClass('ajax');
$OLDVAL = $(this).text();
$(this).html('<input id="editbox" size="20" type="text"
value="' + $(this).text() + '">');
$('#editbox').focus();
});
$('td.edit').keydown(function (event) {
arr = $(this).attr('class').split(" ");
if (event.which == 13) {
$.ajax({
type: "POST",
url: "ajaxpost.php",
data: "value=" + $('.ajax input').val() + "&rownum="
+ arr[2] + "&field=" + arr[1],
success: function (data) {
$('.ajax').html($('.ajax input').val());
$('.ajax').removeClass('ajax');
}
});
}
});
$('#editbox').live('blur', function () {
$('.ajax').html($('.ajax input').val());
$('.ajax').html($OLDVAL);
$('.ajax').removeClass('ajax');
});
});