jQuery简单实现购物车添加删除操作

    xiaoxiao2021-03-25  73

    注:示例仅是简单实现,只写body部分内容,未对jQuery文件进行导入。

    // <body> <table border="1" cellpadding="0" cellspacing="0"> <tr> <td><label><input type='checkbox'/>全选</label></td> <td>商品信息</td> <td>单价</td> <td>数量</td> <td>操作</td> </tr> <tr> <td><input type='checkbox'/></td> <td>电脑</td> <td>5000</td> <td><input type='text' value='1'></td> <td><a href="#">删除</a></td> </tr> </table> <button>点击新增</button> <script> $("button").click(function(){ // 声明变量,存储新增行,变量中全用单引号,方便拼接。(必须放在单击事件内,否则只能生成一次) var newnode=$( "<tr>"+ "<td><input type='checkbox'/></td>"+ "<td>电视</td>"+ "<td>3000</td>"+ "<td><input type='text' value='1'></td>"+ "<td><a href='#'>删除</a></td>"+ "</tr>" ); // 新增节点 $("table").append(newnode) }); // 使用事业委托,删除节点 $("table").on("click","a",function(){ $(this).parents("tr").remove(); }) </script> </body>
    转载请注明原文地址: https://ju.6miu.com/read-37783.html

    最新回复(0)