如何在會話和html表中添加值？

Question

我有樣本HTML表格

<table border="1" id="tableid"> 
      <tr> 
       <th><a href="javascript:edit();" class="editclass">E</a> <a href="javascript:deleteClass();">D</a> <a href="javascript:viewClass();" class="viewClass">V</a> <a href="javascript:addClass();" class="addClass">A</a><br/><input type="checkbox" id="selectall" /></th> 
       <th>Cell phone</th> 
       <th>Rating</th> 
      </tr> 
      <tr> 
       <td align="center"><input type="checkbox" class="case" 
        name="case" value="1" /></td> 
       <td class="cellclass">BlackBerry Bold 9650</td> 
       <td>2/5</td> 
      </tr> 
      <tr> 
       <td align="center"><input type="checkbox" class="case" 
        name="case" value="2" /></td> 
       <td class="cellclass">Samsung Galaxy</td> 
       <td>3.5/5</td> 
      </tr> 
      <tr> 
       <td align="center"><input type="checkbox" class="case" 
        name="case" value="3" /></td> 
       <td class="cellclass">Droid X</td> 
       <td>4.5/5</td> 
      </tr> 
      <tr> 
       <td align="center"><input type="checkbox" class="case" 
        name="case" value="4" /></td> 
       <td class="cellclass">HTC Desire</td> 
       <td>3/5</td> 
      </tr> 
      <tr> 
       <td align="center"><input type="checkbox" class="case" 
        name="case" value="5" /></td> 
       <td class="cellclass">Apple iPhone 4</td> 
       <td>5/5</td> 
      </tr> 

     </table> 

<div id="editId" style="border: 1px solid #000000;"> 
      <p id="editHeadId"></p> 
      Cell Name: <input type="text" name="cellname" id="txtCell"/><br/> 
      Rating: <input type="text" name="rating" id="txtRating"/><br/> 
      <button class="submitclass">Submit</button> <button class="updateclass">Update</button> <button class="cancelclass">Cancel</button> 
     </div> 

我想存儲在會話對象只有在HTML頁面維護的列表，但我沒有使用任何servlet或動作類。我想在會話中存儲更多的對象，並使用包含兩個字段的創建頁面在表中顯示。那也是我可以使用jquery

$(".submitclass").click(function(event){ 
     event.preventDefault(); 
     var rowCount = $('#tableid tr:last').index() + 1; 
     $("#tableid tr").last().after(
       "<tr>"+ 
       "<td align=\"center\"><input type=\"checkbox\" class=\"case\" name=\"case\" value="+ rowCount + " /></td>"+ 
       "<td>"+$("[name='cellname']").val()+"</td>"+ 
       "<td>"+$("[name='rating']").val()+"</td>"+ 
       "</tr>"); 
     $("[name='cellname']").val(""); 
     $("[name='rating']").val(""); 

    }); 

有值表但事實是，當頁面被刷新最近輸入的數據都是刪除只值目前靜態存在。對於動態我可以使用數組對象，並在會話中使用，但我不知道哪個是最簡單的方法來使用jQuery。

Answer 1

function readCookie(name) { 
    var nameEQ = name + "="; 
    var ca = document.cookie.split(';'); 
     for (var i = 0; i < ca.length; i++) { 
      var c = ca[i]; 
      while (c.charAt(0) == ' ') c = c.substring(1, c.length); 
      if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length); 
     } 
    return null; 
} 


$("document").ready(function(){ 

var cookiecellnames=[]; 
var cookieratings=[]; 

var readcellnames=readCookie("cellnames"); 
var ratingsValues=readCookie("ratings"); 


if(readcellnames && ratingsValues){ 
    var cellnamesValue=readcellnames.split(","); 
    var arrayLength = cellnamesValue.length; 

    var ratingsValue=ratingsValues.split(","); 

     for(var i = 0; i < arrayLength; i++) { 
      cookiecellnames.push(cellnamesValue[i]); 
      cookieratings.push(ratingsValue[i]); 
      $("#tableid tr").last().after(
       "<tr>"+ 
       "<td align=\"center\"><input type=\"checkbox\" class=\"case\" name=\"case\" value="+arrayLength+" /></td>"+ 
       "<td>"+cellnamesValue[i]+"</td>"+ 
       "<td>"+ratingsValue[i]+"</td>"+ 
       "</tr>"); 
     } 
} 
//alert(cellnamesValue); 


    $(".submitclass").click(function(event){ 
     event.preventDefault(); 
     var rowCount = $('#tableid tr:last').index() + 1; 
     $("#tableid tr").last().after(
       "<tr>"+ 
       "<td align=\"center\"><input type=\"checkbox\" class=\"case\" name=\"case\" value="+ rowCount + " /></td>"+ 
       "<td>"+$("[name='cellnames']").val()+"</td>"+ 
       "<td>"+$("[name='ratings']").val()+"</td>"+ 
       "</tr>"); 

     cookiecellnames.push($("[name='cellnames']").val()); 
     document.cookie = "cellnames="+cookiecellnames; 

     cookieratings.push($("[name='ratings']").val()); 
     document.cookie = "ratings="+cookieratings; 

     $("[name='cellnames']").val(""); 
     $("[name='ratings']").val(""); 

    }); 
});