現在以下のようなJSを組んでいます。
<html>
<head>
<title>仮想環境</title>
</head>
<body>
<form name="form1">
<h4>仮想環境使用状況</h4>
<h4>3号機</h4>
<table border="1">
<tr>
<th>バージョン名称</th>
<th>IPアドレス</th>
<th>使用者</th>
<th>使用状況</th>
</tr>
<tr>
<td>8105M</td>
<td>192.168.135.XX</td>
<td>
<select name="selMenu">
<option value="A" selected>未使用
<option value="B">太郎
<option value="C">次郎
</select>
</td>
<td>
<input type="radio" name="radioButton" value="O">使用中
<input type="radio" name="radioButton" value="N" checked="checked">使用してない
</td>
</tr>
<tr>
<td>810</td>
<td>192.168.135.XX</td>
<td>
<select name="selMenu">
<option value="A" selected>未使用
<option value="B">太郎
<option value="C">次郎
</select>
</td>
<td>
<input type="radio" name="radioButton" value="O">使用中
<input type="radio" name="radioButton" value="N" checked="checked">使用してない
</td>
</tr>
</table>
<input type="button" onClick="save_cookie()" value="保存">
</form>
<p><span id="view"></span></p>
<script type="text/javascript">
//cookie名
c_name = "sample_cookie"; //最後に=を付けておく
//有効期限
c_day = 365; //日数
//データの区切り
c_split = "_,_"; //データに同じ文字列が含まれないこと
//cookie読込
load_cookie();
//cookieの読込
function load_cookie() {
var c_data,n,m,data;
//cookieの読込
c_data = loadCookie(c_name);
if (c_data != "") {
//データがある場合
data = c_data.split(c_split);
//セレクトメニュー
document.form1.selMenu[data[0]].selected = true;
//ラジオボタン
document.form1.radioButton[data[1]].checked = true;
}
//画面出力
document.getElementById("view").innerHTML = "";
}
//cookieの保存
function save_cookie() {
var n,c_data;
//保存データの準備
//セレクトメニュー
c_data = document.form1.selMenu.selectedIndex + c_split;
//ラジオボタン
for (n=0;n<document.form1.radioButton.length;n++) {
if (document.form1.radioButton[n].checked) {
c_data += n + c_split;
}
}
//画面出力
document.getElementById("view").innerHTML = "内容が保存されました。";
//cookieの保存
saveCookie(c_name,c_data,c_day);
}
//cookie読込
function loadCookie(c_name) {
var s,n,m,c_data;
//cookieの読み込み
c_data = document.cookie;
//cookie名
c_name = c_name + "=";
//有効なcookie名を調べる
n = c_data.indexOf(c_name,0);
if (n > -1) {
//cookieのデータ部分を取り出す
m = c_data.indexOf(";",n + c_name.length);
if (m == -1) m = c_data.length;
s = c_data.substring(n + c_name.length,m);
//デコード
return unescape(s);
} else {
return "";
}
}
//cookie保存
function saveCookie(c_name,c_data,c_day) {
var n,c_date,c_limit;
//有効期限
c_date = new Date();
n = c_date.getTime() + (1000*60*60*24*c_day);
c_date.setTime(n);
c_limit = c_date.toGMTString();
//cookieの書き出し
document.cookie = c_name + "=" + escape(c_data) + "; expires=" + c_limit;
}
</script>
</body>
</html>
ここで、さらに以下のように表を2行に変更しようと思っています。
<tr>
<td>8105M</td>
<td>192.168.135.XX</td>
<td>
<select name="selMenu">
<option value="A" selected>未使用
<option value="B">太郎
<option value="C">次郎
</select>
</td>
<td>
<input type="radio" name="radioButton" value="O">使用中
<input type="radio" name="radioButton" value="N" checked="checked">使用してない
</td>
</tr>
<tr>
<td>810</td>
<td>192.168.135.XX</td>
<td>
<select name="selMenu">
<option value="A" selected>未使用
<option value="B">太郎
<option value="C">次郎
</select>
</td>
<td>
<input type="radio" name="radioButton" value="O">使用中
<input type="radio" name="radioButton" value="N" checked="checked">使用してない
</td>
</tr>
</table>
<input type="button" onClick="save_cookie()" value="保存">
</form>
しかし、2行にすると、保存と読み込みが有効になりません。
初歩的な質問かもしれませんが、対応方法をご教授いただけますでしょうか。
ログイン