js学习-购物数量+1,-1

看到商城里面,可以加减购物数量,就想学习一下

 

代码如下:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>js点击加1的实现</title>
<style type="text/css">

.jia{height:16px;width: auto;text-align:center;display: inline-block;padding: 5px;border: 1px solid #ccc;cursor:pointer;}
.jian{height:16px;width: auto;text-align:center;display: inline-block;padding: 5px;border: 1px solid #ccc;cursor:pointer;}

</style>
<script type="text/javascript">
window.onload = function()
{
var Jjian = document.getElementById("jian");
var Jjia = document.getElementById("jia");
var zj = document.getElementsByTagName("input")[0];
var i = 1;

Jjia.onclick = function()
{
//zj.value = ++i;
i = zj.value;
zj.value = ++i;

}
Jjian.onclick = function()
{
i = zj.value;
zj.value = --i;
}

}
</script>
</head>
<body>
<div id="put">
<span class="jian" id="jian">-</span>
<input type="text" value="1" style="width:50px;text-align:center;height:22px;" />
<span class="jia" id="jia">+</span>
</div>
</body>
</html>

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。