**於
>商品sku選擇demo3
title
>
head
>
<
body
>
<
style
type
="text/css"
>
ul,li
#panel
.goods_attr
.goods_attr .label
.goods_attr ul
.goods_attr li
.goods_attr li.b
.goods_attr li.b img
.goods_attr li.sel
.goods_attr li.text
.goods_attr li.img
style
>
<
div
id="panel"
>
<
div
id="panel_sku_list"
><
pre>
pre>
div>
<
div
id="panel_sel"
>
div>
div>
<
script
src=""
>
script
>
<
script
>
varkeys =;
//sku,stock keeping uint(庫存量單位)
varsku_list=[,,
,,,,
,,,,
];//顯示html結構
function
show_attr_item()
$('#panel_sel
').html(html);
}//顯示資料
function
show_data(sku_list)
$('#panel_sku_list pre
').html(str);
}show_data(sku_list);
show_attr_item();
//返回物件中的乙個陣列,有attr屬性
function
filterproduct(ids)
}//把陣列中的id所在那行的所有元素都壓入result。最後返回
if(_all_ids_in)
});return
result;
}function
filterattrs(ids));
return
result;
}//已選擇的節點陣列
function
_getselattrid());
return
list;
}//註冊點選事件$('
.goods_attr li
').click(
function
()
if($(
this
).hasclass(
'sel'))
else
varselect_ids
=_getselattrid();
////已經選擇了的規格
varids
=filterattrs(select_ids);
//如果id不在已選id所在行組成的陣列中,則然他禁止點選$('
#panel_sel
').find('li
').each(
function
(k2,li2)
else
});});
script
>
body
>
html
>
key是對應動態展示的效果,可以擴充套件屬性值。sku_list是存在的
屬性組合。
存在的是指,在這裡是有attr1,attr2,attr3,attr4(相當於顏色,尺寸,記憶體,型號)這4種規格,裡面有2x4x3x2=48種組合,而實際上售賣的組合只有9種,就是sku__list列出來的。
這2個函式是動態展示資料和結構,依據是上面圖中的2個陣列。keys和sku_list
新增商品sku
1 需求 需要寫乙個新增商品的頁面,主要難點就sku 2 思路 總體來說就是前端生成適合排版的sku資料,之後經過轉換成符合介面的上傳資料,剛開始轉換的時候沒有思路也是花了點時間,畢竟不設限制的sku可以有很多,層級也很深,所以主要用的是遞迴來處理 前端排版時的資料 對應 介面上傳時的資料 對應 3...
sku商品表設計
表關係 分類表 商品表 sku表 庫存表 分類表 屬性名 屬性值 商品表 商品和屬性關係表 屬性名 屬性值 業務邏輯 1.同一商品不同sku庫存和售價不同.2.不同型別的商品具有不同的屬性名和屬性值 如汽車和服飾 所以屬性需要支援後期新增和維護.3.在某個商品分類下通過屬性篩選商品.4.商家某件商品...
商品的SPU和SKU
spu standard product unit spu即標準商品單元,是描述某乙個商品的特性屬性集合。和商品的關係是一對一的關係,比如榮耀10手機,如圖所示 以上的引數都是榮耀10的商品特性 機身長度 寬度 厚度 等,它是乙個商品的固有屬性。sku stock keeping unit sku就...