Question

在输入字段中输入数据并单击提交时。数据应更新到表中。我已经使用了javascript和JSON。我不知道我在代码中哪个地方出错。请帮我。谢谢

<body>
<fieldset id="styfe">
    <legend>Insert Data</legend>
    <input type="text" id="inpbok"> <br><br>
    <input type="text" id="inpdur"><br><br>
    <input type="text" id="inpct"><br><br>
    <input type="button" id="btninsert" value="Submit">
</fieldset> 
    <br><br>

    <fieldset>
            <legend>Local Storage</legend>
            <table id="isOutput">
                <thead><th>BOOK </th><th>DUR</th><th>CT</th></thead>
                    <tr>
                        <td id="bok"></td>               
                        <td id="dur"></td>
                        <td id="ct"></td>
                    </tr>
                </table>
                <div id="isOutput"></div>
        </fieldset>

    <script>

       let pro = [{
                 bok: "bok" ,  
                 dur : "01",  
                 ct: "1.25"},  
 
                 { bok: "saleem" ,  
                 dur : "08",  
                 ct: "1.29"}  

        ];  

        btninsert.onclick = function(bok, dur, ct){

           if(JSON.parse(localStorage.getItem('userinput')) != null){
               localStorage.setItem('userinput', JSON.stringify(pro));
           }
            
           let obj = {
             bok: document.getElementById('inp').value,
             dur: document.getElementById('inpdur').value,
             ct: document.getElementById('inpct').value
        
           }
                pro.push(obj);
                //console.log(person);
                localStorage.setItem('userinput', JSON.stringify(pro)); 

                //   // now we are going to store it in the localstorage 
                   if(bok && dur && ct ){ 
                         localStorage.setItem(bok, dur, ct);
                        location.reload();
                  }
        };


        for(let i=0; i<localStorage.length; i++){
             $('#bok').append("<td>"+localStorage[i].bok+"</td>");
             $('#dur').append("<td>"+localStorage[i].dur+"</td>");
             $('#ct').append("<td>"+localStorage[i].ct+"</td>");       
            
         }
        

    </script>
</body>

请帮我为什么我每次提交数据时都无法将数据添加到表中。

将数据更新到表中

0 个答案: