html
<div class="sumAndMin">
<ul>
<li><span>-</span></li> <!---减-->
<li><div>1</div></li> <!---商量数量-->
<li><span>+</span></li> <!---加-->
<li onclick="Upper()"><img src="img/topPic.png" /></li> <!---上限-->
</ul>
</div>
<!--兑换按钮-->
<footer class="examineBtn" onclick="duihuanY()"><span><font>10</font><font>兑换</font></span></footer>
jq
var duihuanNum=1;//显示当前的兑换数量
var beanNum = 0;//保存个数
var beanIndex = 0;//当前兑换的价值
var priceSum=10;//总价
var beanVlaue;//保存当前优惠券的所值价格
//获取当前用户的兑换总额 ajax请求
$.ajax({
url: "URL",
data: {
"itype": "search",
"lxdh": localStorage.Phone,
},
async: false,
success: function (res) {
var obj = jQuery.parseJSON(res);
beanNum = obj.Num;
}
});
//点击增加按钮触发事件
$(".sumAndMin ul li:nth-child(3)").click(function () {
var num =$(this).parent().find("div")
//单品数量增加
num.text(parseInt(num.text()) + 1);
duihuanNum = num.text();
if (parseInt(num.text())) {
$(".sumAndMin ul li:nth-child(1)").css({ "border": "2px #33b6fe solid" }).change().css({ "color": " #33b6fe" });
}
//计算总价
var goods_price = $(this).parent().parent().parent().find("footer").children().find("font").eq(0);
goods_price.text(parseInt(beanIndex * num.text()));
priceSum = goods_price.text();
//当前需要兑换的数量和总数进行比较
if (goods_price[0].innerText >= beanNum) {
goods_price.text(parseInt((beanIndex * num.text()) - beanIndex));
priceSum = goods_price.text();
num.text(parseInt(num.text()) - 1);
duihuanNum = num.text();
$(this).css({ "border": "2px #a4dbfd solid" }).change().css({ "color": " #a4dbfd" });
return;
}
});
//点击减少按钮触发事件
$(".sumAndMin ul li:nth-child(1)").click(function () {
var num = $(this).parent().find("div");
if (parseInt(num.text())>1) {
num.text(parseInt(num.text()) - 1);
duihuanNum = num.text();
//计算总价
var goods_price = $(this).parent().parent().parent().find("footer").children().find("font").eq(0);
goods_price.text(parseInt(beanIndex * num.text()));
priceSum = goods_price.text();
if (goods_price[0].innerText < beanNum) {
$(".sumAndMin ul li:nth-child(3)").css({ "border": "2px #33b6fe solid" }).change().css({ "color": " #33b6fe" });
}
} else {
$(this).css({ "border": "2px #a4dbfd solid" }).change().css({ "color": " #a4dbfd" });
console.log(num.text("0").parent().html());
duihuanNum = num.text();
var goods_price = $(this).parent().parent().parent().find("footer").children().find("font").eq(0);
goods_price.text(parseInt(0));
priceSum = goods_price.text();
return;
}
});
//点击上限
function Upper() {
console.log(beanIndex);//当前需要兑换数
if (beanNum % beanIndex == 0) {
duihuanNum = beanNum / beanIndex;
}
else {
duihuanNum = Math.floor(beanNum / beanIndex);
}
$(".sumAndMin ul li:nth-child(2) div").text(duihuanNum);
$(".examineBtn span font:nth-child(2)").text(duihuanNum * beanIndex);
priceSum = duihuanNum * beanIndex;
console.log("duihuanNum=" + duihuanNum);
$(".sumAndMin ul li:nth-child(1)").css({ "border": "2px #33b6fe solid" }).change().css({ "color": " #33b6fe" });
$(".sumAndMin ul li:nth-child(3)").css({ "border": "2px #a4dbfd solid" }).change().css({ "color": " #a4dbfd" });
return;
}
//点击兑换按钮
function duihuanY() {
console.log(priceSum);
console.log(duihuanNum)
//添加兑换个数
$.post("URL", { DATA }, function (data) {
if (data=="ok") {
//添加兑换记录
$.post("URL", { DATA }, function (data) {
if (data == "ok") {
//更新总额信息
$.post(URL, { DATA }, function (data) {
layer.msg('兑换成功', {
offset: ['50%'],
time: 2000
}, function () {
window.location.reload();
});
})
}
});
} else {
layer.msg('兑换失败');
}
})
}