jquery购物车实时结算特效实现思路

 更新时间:2013年09月23日 11:37:50   作者:  
购物车是可以实时结算,下面为大家解释下通过jquery是如何实现的,感兴趣的朋友可以了解下
复制代码 代码如下:

$(function(){
$(".child_tab tr:last-child").find("td").css({borderBottom:'none'})
//获得文本框对象
var t = $(".amount-input");
//数量增加操作
$(".amount-up").click(function(e){
var c1=parseInt($(this).prev().val());
$(this).prev().val(c1+1);
e.preventDefault()
setTotal();
});
//数量减少操作
$(".amount-down").click(function(e){
var c1=parseInt($(this).next().val());
if(c1>=1){
$(this).next().val(c1-1);
};
e.preventDefault()
setTotal();
});
function setTotal(){
//取每个条件的值
var num1=$(".sum1").text();
var num2=$(".sum2").text();
var num3=$(".sum3").text();
var total=0;
var x1=4,x2=10,x3=49;
//遍历合计件数
t.each(function(index,ele){
total+=parseInt($(ele).val());
});
$(".figure").html(total);
//判断个数满足哪个要求
if(total<x2){
b2=num1
}else if(total>=x2&&total<=x3){
b2=num2
}else if(total>=x3){
b2=num3
}
$(".money").html((total*b2).toFixed(2)+'元');//toFixed()是保留小数点的函数很实用哦
}
//初始化
setTotal();

})

相关文章

  • jQuery修改DOM结构_动力节点Java学院整理

    jQuery修改DOM结构_动力节点Java学院整理

    这篇文章主要介绍了jQuery修改DOM结构的相关知识,需要的的朋友参考下吧
    2017-07-07
  • 基于JQUERY的多级联动代码

    基于JQUERY的多级联动代码

    基于JQUERY的多级联动实现代码,需要的朋友可以参考下,另外脚本之家特为大家多整理了几个大家可以测试下
    2012-01-01
  • jquery 简单应用示例总结

    jquery 简单应用示例总结

    jquery 想必大家早已如雷贯耳,本文整理了一些在实际应用中比较常见的功能片段,感兴趣的朋友可以学习下哦,需要改进的地方希望大家不惜指教
    2013-08-08
  • JQuery.uploadify 上传文件插件的使用详解 for ASP.NET

    JQuery.uploadify 上传文件插件的使用详解 for ASP.NET

    今天下午整理文件上传的例子,感觉收集到的例子都很不人性话,后来找到一个还可以的,本来想改成类似于腾讯QQ相册那种方式,仔细看了一下是Flash的, 而且那个极速上传插件也不知道用什么做的?问了一下,说是什么cgi. 搞得一头雾水
    2010-01-01
  • jquery attr()设置和获取属性值实例教程

    jquery attr()设置和获取属性值实例教程

    在JS中设置节点的属性与属性值用到setAttribute(),获得节点的属性与属性值用到getAttribute(),而在jquery中,只需要用到attr()这个函数就可以了。attr是attribute(属性)的缩写。
    2016-09-09
  • jQuery内部原理和实现方式浅析

    jQuery内部原理和实现方式浅析

    这篇文章主要介绍了jQuery内部原理和实现方式浅析,本文试图从整体来阐述一下jQuery的内部实现,需要的朋友可以参考下
    2015-02-02
  • jQuery DOM插入节点操作指南

    jQuery DOM插入节点操作指南

    本章节主要介绍了jQuery在HTML中动态插入节点的各种方法,制作成表格,方便大家对比学习,需要的朋友可以参考下
    2015-03-03
  • 利用js(jquery)操作Cookie的方法说明

    利用js(jquery)操作Cookie的方法说明

    本篇文章主要是对利用js(jquery)操作Cookie的方法进行了详细的说明介绍,需要的朋友可以过来参考下,希望对大家有所帮助
    2013-12-12
  • 一个实用的图片切换支持点击切换和自动轮播

    一个实用的图片切换支持点击切换和自动轮播

    这篇文章主要介绍了一个实用的图片切换支持点击切换和自动轮播,经测试效果相当不错,需要的朋友可以参考下
    2014-09-09
  • JQuery中DOM事件冒泡实例分析

    JQuery中DOM事件冒泡实例分析

    这篇文章主要介绍了JQuery中DOM事件冒泡用法,实例分析了事件冒泡的原理与阻止冒泡的方法,需要的朋友可以参考下
    2015-06-06

最新评论