Question

我需要输入具有特定产品ID的数据并将其保存在本地。单击该按钮，它将它们保存到本地存储。单个产品可以有多个文件名。

在客户中，如果客户提供了id的名称，它应该在文本区域中显示属于id的所有文件名。

 <!DOCTYPE html>
    <html>
        <title>W3.CSS</title>
            <meta name="viewport" content="width=device-width, initial-scale=1">
            <link rel="stylesheet" href="http://www.w3schools.com/lib/w3.css">
            <script type="text/javascript">
                var filename = []
            var productid = []

            function managerClick(){
                console.log("manager", productid);  
                console.log("manager", filename);   

                productid.push(document.getElementById("productId").value);
                filename.push(document.getElementById("names").value);

                localStorage.setItem("filename", JSON.stringify(filename)); 
                localStorage.setItem("productid", JSON.stringify(productid));   

                var result={}
                   productid.map(function(k){
                   result[k]=filename;
                   })
                  console.log(result);         

                console.log("productid",productid); 
                console.log("filename",filename);       
            };
                function customerClick(){
                  console.log("Customer");
                 document.getElementById('myTextarea').value = filename;

             };
            </script>
        <body>
            <div class="w3-card-4 w3-margin" style="width:50%;">         
                 <center>Manager</center>

                <div class="w3-container">
                    Product Id: <input type="text" id="productId"><br></br>
                    File Name: <input type="text" id="names"><br></br>
                    <center><button class="w3-btn w3-dark-grey" onclick="managerClick()">Data Entered</button></center><br>
                </div>

                 <center>Customer</center>

                <div class="w3-container">
                    Product Id: <input type="text" id="CustomerpId"><br></br>               
                    <center>
                        <button class="w3-btn w3-dark-grey" onclick="customerClick()">Click To get filename</button>
                    </center><br>
                    <textarea rows="4" cols="30"></textarea>
                </div>
            </div>
        </body>
    </html>

我需要的是1个产品可能有多个文件，但它不应该对其他产品可见。有人可以帮我做吗？

i tryed like this and i get

产品1＆amp;的文件名产品2显示在两个产品中产品1应该有产品1文件1,2,3 产品2应该有产品2文件1,2,3,4

Answer 1

试试这个

<script type="text/javascript">

    var productdetail = []

    function managerClick() {

        productdetail.push({ productid: document.getElementById("productId").value, filename: document.getElementById("names").value });


        localStorage.setItem("ProductDetails", JSON.stringify(productdetail));


    };
    function customerClick() {

        var prod = JSON.parse(localStorage.getItem("ProductDetails"))
        var selectedProductID = document.getElementById("CustomerpId").value

        for (var i = 0; i < prod.length; i++) {
            if (prod[i].productid == selectedProductID) {
                document.getElementById('myTextarea').value = document.getElementById('myTextarea').value +" "+prod[i].filename;

                  Console.log(prod[i].filename);
                }
            }
        };
    </script>

        <textarea rows="4" cols="30" id="myTextarea"></textarea>

在本地存储中输入并显示数组作为对象

1 个答案: