央企文库

首页 > 关于我们 > 资源分享

资源分享

帝国CMS插件 不同属性不同价格

更新时间:2018-01-01 立即下载

参与价格增减的字段可以随便命名定义,字段输入表单替换元素需设置成多值字段,3列

peice: 商品价格(所有属性在此价格上增加扣除)一个input输入框

下载包中已经包含了模型,内容模板,插件目录

压缩包中的differPrice目录放到/e/extend/目录下, 新建一个内容模板,将压缩包中的模板.txt放进去。导入模型即可测试。

字段截图:

字段设置截图:

信息截图:

前台效果截图:

**********

这里讲下内容模板中的php程序和JQ插件:

内容模板中的php代码块说明:

$color = explode('||||||', $navinfor['color']); // 分割字段名为 “color”的多值字段的属性,字段color是3列的多值字段

$colorHtml = ''; // html模板中输出的变量名

$tpl = '<div class="btn btn-default" price="%s" condition="%s">%s</div>'; // html模板

$colorData = array(); // 分割属性

foreach ($color as $key => $value) { // 分割行内元素

$colorData[$key] = explode('::::::', $value);

$colorHtml .= sprintf($tpl, $colorData[$key][2], $colorData[$key][1], $colorData[$key][0]);

}

以颜色字段color说明:

在添加信息的时候其第一行是3列:

颜色名    操作方向    操作值

紫色      -          10

上述代码运行后得到的html就是

<div class="btn btn-default" price="10" condition="-">紫色</div>

jq脚本会抓取 price 和 condition 来运算

其他字段也一样拆分成这样的格式

页面构造的时候请按下面的格式:

<div id="differ">

<div>

<?=$colorHtml?>

</div>

<div>

***

</div>

</div>

js代码:

;(function($) {

$.fn.extend({

"differPrice" : function(opt) {

opt = $.extend({

btnElem: ".btn", // 参与选择的子元素class

princeElem: "#ExtendAttrPrice", // 显示价格的element元素

activeElem: ".btn-primary", // 选择元素后增加的class名称

notLoginElem: "#notLogin", // 未登录后提示的盒子element元素

member: {}, // 会员组优惠价格数组

groupid: 0 // 用户会员组

}, opt);

var price = $(opt.princeElem).attr("price");

opt.price = Number(price);

if (opt.groupid > 0) {

$(opt.notLoginElem).hide();

for(i in opt.member) {

if (opt.member[i].groupid == opt.groupid) {

if (opt.member[i].condition == '-') {

opt.price = opt.price - opt.member[i].price;

$(opt.princeElem).html(opt.price);

$(opt.princeElem).attr("price", opt.price);

}

}

}

}

$(this).find(opt.btnElem).on("click", function() {

var $parentElem = $(this).parent(); // 父元素

var $beforeSelect = $parentElem.find(opt.btnElem).is(opt.activeElem);          

var price = $(opt.princeElem).attr("price");

price = Number(price);

if ($beforeSelect == true) {

var $beforeSelectData = {

"price": Number( $parentElem.find(opt.btnElem).filter(opt.activeElem).attr("price") ),

"condition": $parentElem.find(opt.btnElem).filter(opt.activeElem).attr("condition")

};

if ($beforeSelectData.condition == "+") {

price = price - $beforeSelectData.price;

$(opt.princeElem).html(price);

$(opt.princeElem).attr("price", price);

}

if ($beforeSelectData.condition == "-") {

price = price + $beforeSelectData.price;

$(opt.princeElem).html(price);

$(opt.princeElem).attr("price", price);   

}

if ($(this).index() == $parentElem.find(opt.btnElem).filter(opt.activeElem).index()) {

$(this).parent().find(".btn-primary").removeClass("btn-primary");

return;

}

}

var selectData = {

"price" : Number( $(this).attr("price") ),

"condition" : $(this).attr("condition")

};

if (selectData.condition == "+") {

price = price + selectData.price;

$(opt.princeElem).html(price);

$(opt.princeElem).attr("price", price);

}

if (selectData.condition == "-") {

price = price - selectData.price;

$(opt.princeElem).html(price);

$(opt.princeElem).attr("price", price);   

}

// 按钮选中样式

$(this).parent().find(".btn-primary").removeClass("btn-primary");

$(this).addClass("btn-primary");

});

}

});

})(jQuery);

*********************

使用说明:

$("#differ").differPrice({member, groupid});

js调用说明:

$("#differ") 为商品属性选择按钮的父元素

member: {}, // 会员组优惠价格数组

groupid: 0 // 用户会员组

会员组通过 <script src="/e/extend/differPrice/retUserGroupid.php"></script> 已经获取到登录用户的会员组

如果你的html模板不想用默认的ID 可以覆盖值:

$("#differ").differPrice({

btnElem: ".btn", // 参与选择的子元素class

princeElem: "#ExtendAttrPrice", // 显示价格的element元素

activeElem: ".btn-primary", // 选择元素后增加的class名称

notLoginElem: "#notLogin", // 未登录后提示的盒子element元素

member: {}, // 会员组优惠价格数组

groupid: 0 // 用户会员组

});

****

其他请参考压缩包中的内容模板。

每个网站其用户主的考虑角度都是不一样的,但是不同属性不同价格都可以在此插件上扩展。 

主要是分割字段内容,按照字段中的规则运算价格。

******************************

商城订单、购物车自己巴拉巴拉改吧

文章评论