0
私はユーザー入力を受け取り、それをAjaxサーバーに保存するHTML形式の表を作成しています。ページがリフレッシュされると、新しく入力されたテキストはそのまま残ります。ただし、別のコンピュータ/電話などのユーザーが自分のウェブサイトの表を表示すると、他の誰かが自分のデバイスで行った変更は表示されません。言い換えれば、ユーザーがウェブサイト上のテーブルのコンテンツを動的に編集してから、ウェブサイトを訪れたすべての人がその情報を閲覧できるようにする方法はありますか？Ajaxサーバーに保存
私はJSの経験が少ないので、より詳細な説明が役立ちます。本当にありがとう！あなたはそれがないすべてのデータを保存しているのlocalStorage を介してクライアントのブラウザにデータを保存している
をAJAXないこの
td, table tr, th {
border: 1px solid Black;
border-collapse: collapse;
}<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="WorkLog.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<meta charset="UTF-8">
<title>Work Log</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
</head>
<body>
<h1>Work Log Template</h1>
<table id=WorkLog contenteditable=true>
<tr>
<th>Item</th>
<th>Estimated Length</th>
<th>Comments/Brief Summary (optional)</th>
<th>Actions</th>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td><input type="button" class="BtnPlus" value="+" /><input type="button" class="BtnMinus" value="-" /></td>
</tr>
</table>
<script type="text/javascript">
$(document).ready(function() {
function addRow() {
var html = '<tr>' +
'<td>new item</td>' +
'<td></td>' +
'<td></td>' +
'<td><input type="button" class="BtnPlus" value="+" /><input type="button" class="BtnMinus" value="-" /></td>' +
'</tr>'
$(html).appendTo($("#WorkLog"))
};
$("#WorkLog").on("click", ".BtnPlus", addRow);
});
</script>
<script>
function deleteRow() {
var par = $(this).closest('TR');
par.remove();
};
$("#WorkLog").on("click", ".BtnMinus", deleteRow);
</script>
<script>
$(document).ready(function(){
$("#WorkLog").blur(function() {
localStorage.setItem('WorkLogsData', this.innerHTML);
});
if (localStorage.getItem('WorkLogsData')) {
$("#WorkLog").html(localStorage.getItem('WorkLogsData'));
}
});
</script>
</body>
</html>
'localStorage'がブラウザに所属します。他のユーザーにデータを表示させたい場合は、そのデータをサーバー側（DBまたはテキストファイル内）に保存し、人以上の人にサービスを提供する必要があります。 –