Fatal编程技术网
  • javascript/
  • Javascript 如何使用html5本地存储加载值

Javascript 如何使用html5本地存储加载值

javascript html input

Javascript 如何使用html5本地存储加载值,javascript,html,input,Javascript,Html,Input,我想把我的输入也作为表格中的输出。我复制了下面的代码，因为我只想知道如何获得输出 我想我必须改变这个 <input type="button" value="load" onclick="load_local();"/ 试验 函数save（） { var arr=新数组（）； var obj1=parseInt（document.getElementById（“txt1”）.value）； var obj2=parseInt（document.getElementByI

我想把我的输入也作为表格中的输出。我复制了下面的代码，因为我只想知道如何获得输出

我想我必须改变这个

<input type="button" value="load" onclick="load_local();"/


试验
















函数save（）
{
var arr=新数组（）；
var obj1=parseInt（document.getElementById（“txt1”）.value）；
var obj2=parseInt（document.getElementById（“txt2”）.value）；
var obj3=parseInt（document.getElementById（“txt3”）.value）；
var obj4=parseInt（document.getElementById（“txt4”）.value）；
var obj5=parseInt（document.getElementById（“txt5”）.value）；
var obj6=parseInt（document.getElementById（“txt6”）.value）；
var obj7=parseInt（document.getElementById（“txt7”）.value）；
var obj8=parseInt（document.getElementById（“txt8”）.value）；
arr.push（obj1）；
arr.push（obj2）；
arr.push（obj3）；
arr.push（obj4）；
arr.push（obj5）；
arr.push（obj6）；
arr.push（obj7）；
arr.push（obj8）；
var arrodered=u.sortBy（arr，函数（项）{
return item；//您可以在这里实现您的逻辑
});
var html=“”；
_.each（无序，函数（项）{html+=item+“
”；}）；
document.getElementById（'output'）。innerHTML=html；
}

对不起，你的问题是什么？是否也要在输出中显示存储的值？for（varitem in arrorded）{document.write（item）；}

<!DOCTYPE HTML>

    <html>
        <head>
            <TITLE>HTML5 local storage tester (testbed)</TITLE>
        </head>
        <body>
            <div id="output_area" 
            style="position:relative;width:100%;height:200px;overflow:auto;
            border: dotted 1px #ff0000;">
            </div>

            <div>
                <input id="local_storage_key" type="text" />
                <input id="local_storage_value" type="text" />
            </div>

            <div>
                <input type="button" value="load" onclick="load_local();"/>
                <input type="button" value="store" onclick="store_local();"/>
            </div>
            <script id="this_page_js" type="text/javascript">

            /* store some string data to local storage
                This is using some text input elements on the page
                for input.*/

            function store_local(domid_prefix){
                var keyinput = document.getElementById('local_storage_key').value;
                var valinput = document.getElementById('local_storage_value').value;
                try{
                    if(typeof(window.localStorage) != 'undefined'){
                    window.localStorage.setItem(keyinput,valinput);
                    }
                    else{
                        throw "window.localStorage, not defined";
                    }
                }
                catch(err){
                    output_str("store_local,error," + err);
                }
            }

            /* load some string data from local storage
                This is using some text input elements on the page
                for the key name input and value output.*/

            function load_local(domid_prefix){
                var keyinput = document.getElementById('local_storage_key').value;
              var valoutput = document.getElementById('local_storage_value');
              try {
                if(typeof(window.localStorage) != 'undefined') {
                  valoutput.value = window.localStorage.getItem(keyinput);
                }
                else {
                  throw "window.localStorage, not defined";
                }
              }
              catch(err) {
                output_str("store_local,error," + err);
              }
            }

            /* function to print to the debug area */

            function output_str(str){
                var da = document.getElementById("output_area");
                da.innerHTML += str + "<br/>";
                da.scrollTop = da.scrollHeight;
            }
            </script>
         </body>
    </html> 



function load()
            {
                var arr =new Array();

                var obj1 = document.getElementById("txt1").value;
                var obj2 = document.getElementById("txt2").value;
                var obj3 = document.getElementById("txt3").value;
                var obj4 = document.getElementById("txt4").value;
                var obj5 = document.getElementById("txt5").value;
                var obj6 = document.getElementById("txt6").value;
                var obj7 = document.getElementById("txt7").value;
                var obj8 = document.getElementById("txt8").value;

                arr.push(obj1);
                arr.push(obj2);
                arr.push(obj3);
                arr.push(obj4);
                arr.push(obj5);
                arr.push(obj6);
                arr.push(obj7);
                arr.push(obj8);

                var arrOrdered = _.sortBy(arr, function (item) {
                    return item; //you could implement your logic in here
                });
                iterate.over(arrOrdered);
            }



<html>
    <head>
        <title>Test</title>
    </head>
    <body>
        <input type="text" id="txt1" /><br/>
        <input type="text" id="txt2" /><br/>
        <input type="text" id="txt3" /><br/>
        <input type="text" id="txt4" /><br/>
        <input type="text" id="txt5" /><br/>
        <input type="text" id="txt6" /><br/>
        <input type="text" id="txt7" /><br/>
        <input type="text" id="txt8" /><br/>
        <input type="button" id="btn" value="Save" onclick="javascript: return save();"/>
        <div id="output"></div>
        <script type="text/javascript" src="http://underscorejs.org/underscore-min.js"></script>
        <script type="text/javascript">

            function save()
            {
                var arr =new Array();

                var obj1 = parseInt(document.getElementById("txt1").value);
                var obj2 = parseInt(document.getElementById("txt2").value);
                var obj3 = parseInt(document.getElementById("txt3").value);
                var obj4 = parseInt(document.getElementById("txt4").value);
                var obj5 = parseInt(document.getElementById("txt5").value);
                var obj6 = parseInt(document.getElementById("txt6").value);
                var obj7 = parseInt(document.getElementById("txt7").value);
                var obj8 = parseInt(document.getElementById("txt8").value);

                arr.push(obj1);
                arr.push(obj2);
                arr.push(obj3);
                arr.push(obj4);
                arr.push(obj5);
                arr.push(obj6);
                arr.push(obj7);
                arr.push(obj8);

                var arrOrdered = _.sortBy(arr, function (item) {
                    return item; //you could implement your logic in here
                });

                var html = "";

                _.each(arrOrdered, function(item){ html += item + "<br/>";});

                document.getElementById('output').innerHTML = html;
            }

        </script>
    </body>
</html>