码迷,mamicode.com
首页 > 其他好文 > 详细

localStorage购物车

时间:2017-09-05 20:56:51      阅读:106      评论:0      收藏:0      [点我收藏+]

标签:col   fun   click   key   购物车   app   query   head   end   

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>购物车</title>
<script src="./jquery-3.1.1.min.js"></script>
</head>
<table width="200" border="1">
  <tr>
    <th scope="col">name</th>
    <th scope="col">num</th>
    <th scope="col">add</th>
  </tr>
  <tr>
    <td class="name">A</td>
    <td class="num">1</td>
    <td><input type="button" onClick="add(this)" value="加入"></td>
  </tr>
  <tr>
    <td class="name">B</td>
    <td class="num">1</td>
    <td><input type="button" onClick="add(this)" value="加入"></td>
  </tr>
</table>
<div id="car">
    
</div>
<body>
<script>
    var str="";
    function add(obj){
        var a = $(obj).parent().parent("tr").find(".num").html();
        var b = $(obj).parent().parent("tr").find(".name").html();
        var html = "<p>"+b+"============================="+a+"<button onclick=‘del(this)‘>删除</button></p>";
        $("#car").append(html);
        //arr.push(html);
        var c = $("#car").html();
        localStorage.setItem("car",c);
        
        console.log(b);
    }
    function del(obj){
        //localStorage.removeItem("car");
        //return false;
        $(obj).parent().remove();
        $(obj).remove();
        var c = $("#car").html();
        localStorage.setItem("car",c);
    }
    function list(){
        for(var i=0;i<localStorage.length;i++){
             var name = localStorage.key(i);
             var value = localStorage.getItem(name);
             $("#car").append(value);
        }
    }
    list();
</script>
</body>
</html>

localStorage购物车

标签:col   fun   click   key   购物车   app   query   head   end   

原文地址:http://www.cnblogs.com/liu-heng/p/7481615.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!