jsorder

基于jquery的购物车
授权协议 Apache
开发语言 JavaScript
所属分类 jQuery 插件、 其他jQuery插件
软件类型 开源软件
地区 国产
投 递 者 莘翰采
操作系统 跨平台
开源组织
适用人群 未知
 软件概览

代码一共6k,基于jquery的购物车实现,实现订单的本地cookie存储,支持购物车自定义样式,金额的计算。通过json与后台交互。实现可配置化的购物车系统,可应用于电子商务平台。

demo地址:http://wuzhi.me/jsorderdemo.php

3.配置说明: jsorder 支持多参数配置,自定义购物车样式,设置是否记录cookie,提交方式 等。

$.fn.jsorder.defaults = {
    //作为订单数据存储的浏览器端全局变量,通过jquery绑定在body     staticname : 'jsorder',
    //订单class,确保在页面class唯一不重复,否则将导致错误     jsorderclass : 'jsorder',
    //是否保存cookie     savecookie : true,
    //cookie的名字     cookiename : 'jsorder',
    //ID前缀,暂时无用     numpre : 'no_',
    //订单项前缀,用来区分不同的订单项,页面内必须不重复     jsorderpre : 'jsorder_',
    //触发订单控件的价格属性     pricefiled : 'price',
         //触发订单控件的订单名属性          namefiled : 'jsordername',
         //购物车左侧显示         leftdemo : '我的菜单',
         //提交按钮文字         subbuttom : '',
         //默认加入订单的控件选择         addbuttom : 'a.jsorderadd',
         //没有订单时显示         nomessage : '你今天的食谱是还空的',
         //提交时触发         dosubmit : function(data) {
                $("body").append(JSON.stringify(data));
                $("body").data(opts.staticname, {});
        }
};

4.页面代码
1)样式表及js



2)触发控件配置

3)覆盖默认配置项

$.fn.jsorder.defaults = {
        //修改触发空间类型         addbuttom : 'td.jsorderadd',
        //修改提交方案 dosubmit : function(data) {$("#result").html("json内容:"+JSON.stringify(data)).css('background','#e0e0e0');} };

4)开始加载购物车

$("body").jsorder();

欢迎提供意见和建议。邮箱:1286514442@qq.com

 相关资料
  • 晚上好,夫人/先生。我正在用jquery Ajax开发购物车。我的代码是工作的,但它只工作在1个产品(行),如果我改变数量,我的第二个产品(行),计算不会工作。 更新:我将jquery从使用ID属性改为使用class属性,问题是total显示在所有列中,而不是在他选择的产品数量上。

  • 本文向大家介绍asp.net基于HashTable实现购物车的方法,包括了asp.net基于HashTable实现购物车的方法的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了asp.net基于HashTable实现购物车的方法。分享给大家供大家参考,具体如下: 希望本文所述对大家asp.net程序设计有所帮助。

  • 在我的Woocommerce网店里,我有不同的产品。我想根据购物车物品的总重量计算运费: 从到Kilos的成本是, 从到Kilos成本是 事实上,如果我有一个1公斤的产品,运费是,但是如果我的篮子里有10件这个产品,运费仍然是(应该是代替)。 如何根据购物车总重量计算渐进运费?

  • 本文向大家介绍jQuery模拟淘宝购物车功能,包括了jQuery模拟淘宝购物车功能的使用技巧和注意事项,需要的朋友参考一下 首先我们要实现的内容的需求有如下几点: 1.在购物车页面中,当选中“全选”复选框时,所有商品前的复选框被选中,否则所有商品的复选框取消选中。 2.当所有商品前的复选框选中时,“全选”复选框被选中,否则“全选”复选框取消选中。 3.单击图标-的时候数量减一而且不能让物品小于0并

  • pre { white-space: pre-wrap; } 如果您能够通过您的 Web 应用简单地实现拖动和放置,您就会知道一些特别的东西。通过 jQuery EasyUI,我们在 Web 应用中可以简单地实现拖放功能。 在本教程中,我们将向您展示如何创建一个启用用户拖动和放置用户想买的商品的购物车页面。购物篮中的物品和价格将更新。 显示页面上的商品     <ul>         <li>

  • 本文向大家介绍Python实现购物车购物小程序,包括了Python实现购物车购物小程序的使用技巧和注意事项,需要的朋友参考一下 概要 按理说,我们入门的第一个小程序都应该是Hello World。因为比较简单,我这也就不做过多的演示 了。 下面是我写的一个小程序。主要用于练习Python的基本语法,以及入门。 主要实现功能 要求用户输入自己预期消费额度. 展示现有商品信息,要求用户选择 用户选择对