当前位置：首页 > 编程资源 > 编程问答 >内容正文

编程问答

js实现购物车数量的增加与减少，js实现购物车数量的自增与自减

发布时间：2025/4/16 编程问答 12 豆豆

生活随笔收集整理的这篇文章主要介绍了 js实现购物车数量的增加与减少，js实现购物车数量的自增与自减小编觉得挺不错的,现在分享给大家,帮大家做个参考.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>js实现购物车数量的增加与减少，js实现购物车数量的自增与自减</title> </head><body> <center> <table> <tr> <td>1</td> <td><span onclick="changeNum(this,1)" style="cursor:pointer;">+</span><input type="text" value="" onblur="checknum(this)" /><span onclick="changeNum(this,-1)" style="cursor:pointer;">-</span></td> </tr> <tr> <td>2</td> <td><span onclick="changeNum(this,1)" style="cursor:pointer;">+</span><input type="text" value="" onblur="checknum(this)" /><span onclick="changeNum(this,-1)" style="cursor:pointer;">-</span></td> </tr> <tr> <td>3</td> <td><span onclick="changeNum(this,1)" style="cursor:pointer;">+</span><input type="text" value="" onblur="checknum(this)" /><span onclick="changeNum(this,-1)" style="cursor:pointer;">-</span></td> </tr> </table> </center> <script type="text/javascript"> function checknum(obj){if(obj.value >10){obj.value = 10;alert('Max 10!');} } function changeNum(obj,num) {var input = getParent(obj).getElementsByTagName("input");for(var i=0;i<input.length;i++){if(input[i].type=="text"){if(input[i].value == "")input[i].value = num;elseinput[i].value = input[i].value - 0 + num;}if(input[i].value == "-1")input[i].value = 0;if(input[i].value == "11")input[i].value = 10;} } //获取父级对像 function getParent(obj) {if(typeof(obj) != "object"){obj = document.getElementById(obj);}if(obj)return obj.parentElement || obj.parentNode; } </script> </body> </html>

转载于:https://www.cnblogs.com/afish/p/4098163.html

总结

以上是生活随笔为你收集整理的js实现购物车数量的增加与减少，js实现购物车数量的自增与自减的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。