页面刷新后，无法使用javascript保留动态形成的表行中的值

Question

我的jsp中有以下js代码。 刷新页面后，我无法在下面保留这些文本框值。 任何想法如何保留价值？ 我在一个HTML按钮的onclick上调用此js函数，以便将其动态添加到表中。

 <script>
        function addRow(tableID) {
            if(validateForm()==true){
            document.getElementById('cruisedowntime2').style.display = "block";
            var table = document.getElementById(tableID);

            var rowCount = table.rows.length;
            var row = table.insertRow(rowCount);

          /*  var cell1 = row.insertCell(0);
            var element1 = document.createElement("input");
            element1.type = "checkbox";
            element1.name = "chkbox[]";
            element1.defaultChecked="true";
            cell1.appendChild(element1);*/

            var cell0 = row.insertCell(0);
            var element0=document.createElement("select");
            element0.name="cruiselinedropdown";
            var dropdownlist1=document.getElementById("droplist1");

            var defaultselected=dropdownlist1.options[dropdownlist1.selectedIndex].value;
    //window.location.replace("http://localhost:8085/Bridge_Downtime_Utility/Servlet?var="+defaultselected);
            <%Map<String, String> map = new HashMap<String,String>();
                                    for (int i = 0; i < crsenamelist.size(); i++) {
                                        map.put(crsenamelist.get(i),crsecodelist.get(i));
                                    }


                       %>
            element0.options.add( new Option(defaultselected,defaultselected,true,true) );

            element0.options.add( new Option("--","") );
            <%

      for(Map.Entry m:map.entrySet()){   %>
            element0.options.add( new Option("<%=m.getValue()%>","<%=m.getValue()%>") );

            cell0.appendChild(element0);<%}%>

            var textbox3=document.getElementById('starttime');
            var textbox7=document.getElementById('startdate');
            var cell2 = row.insertCell(1);
            var element2 = document.createElement("input");
            element2.title="Date: YYYY-MM-DD";
            element2.type = "text";
            element2.name = "starttimetextbox";
            element2.value=textbox7.value+"  "+textbox3.value;
            cell2.appendChild(element2);

            var textbox5=document.getElementById('endtime');
            var textbox9=document.getElementById('enddate');
            var cell3 = row.insertCell(2);
            var element3 = document.createElement("input");
            element3.title="Date: YYYY-MM-DD";
            element3.type = "text";
            element3.name = "endtimetextbox";
            element3.value=textbox9.value+"  "+textbox5.value;
            cell3.appendChild(element3);

            var textbox1=document.getElementById('descrip');
            var cell4 = row.insertCell(3);
            var element4 = document.createElement("input");
            element4.type = "text";
            element4.name = "descriptextbox";
            if(textbox1.value==''){element4.value="-";}
            else
            element4.value=textbox1.value;
            cell4.appendChild(element4);
            //cell4.contenteditable=true;
           /* var addRowBox = document.createElement("input");
            addRowBox.setAttribute("type", "button");
            addRowBox.setAttribute("value", "Edit");



            var cell5 = row.insertCell(5);
            cell5.appendChild(addRowBox);*/


            var deleteRowBox = document.createElement("input");
            deleteRowBox.setAttribute("type", "button");
            deleteRowBox.setAttribute("value", "X");
            deleteRowBox.setAttribute("onclick","SomeDeleteRowFunction(this)");

            var cell6 = row.insertCell(4);
            cell6.appendChild(deleteRowBox);
            }}





    </script>

Answer 1

如果您希望数据在页面刷新后仍然存在，则可以存储数据，然后从localStorage加载。

Answer 2

要在刷新页面时保留数据，您需要将其保存在某处，以供将来（页面重新加载后）访问。

• 将其存储在后端的某个位置，然后在页面加载时访问您的REST服务。
• 将其存储在浏览器的localStorage \\ sessionStorage中。

没有其他方法可以保留数据而不实际保留它:)