JQ或JS仿淘宝商品详情选择规格颜色等属性
选择要求：有几个属性，如 尺寸和颜色，尺寸：M、L、XL、XXL 等，颜色：黑色、白色、黄色、红色等，其每个属性都有关联，如 首选M，颜色除黑色外都能选择；如首选 黄色，尺寸除XXL外都能选择。
自己写的有问题。代码放上一部分。已生成的数组求值。
HTML：↓
<div class="sys_item_spec">
<dl class="clearfix iteminfo_parameter sys_item_specpara" data-sid="1">
<dt>尺寸:</dt>
<dd>
<ul class="sys_spec_text" id="123">
<li data-aid="3" id="s"><a href="javascript:;" title="S" >S</a><i></i></li>
<li data-aid="3" id="m"><a href="javascript:;" title="M" >M</a><i></i></li>
<li data-aid="3" id="xs"><a href="javascript:;" title="XS" >XS</a><i></i></li>
</ul>
</dd>
</dl><dl class="clearfix iteminfo_parameter sys_item_specpara" data-sid="1">
<dt>颜色:</dt>
<dd>
<ul class="sys_spec_text" id="abc">
<li data-aid="3" id="b"><a href="javascript:;" title="黑色" >黑色</a><i></i></li>
<li data-aid="3" id="w"><a href="javascript:;" title="白色" >白色</a><i></i></li>
<li data-aid="3" id="r"><a href="javascript:;" title="红色" >红色</a><i></i></li>
</ul>
</dd>
</dl> </div>
</div>
JS：↓
goodsguige[0] = ["分组ID","尺寸","唯一主ID","S"];
goodsguige[1] = ["分组ID","尺寸","唯一主ID","M"];
goodsguige[2] = ["分组ID","尺寸","唯一主ID","XS"];
goodsguige[5] = ["分组ID","颜色","唯一主ID","黑色"];
goodsguige[6] = ["分组ID","颜色","唯一主ID","白色"];
goodsgroup[0] = ["4","分组ID1","唯一主ID"];
goodsgroup[1] = ["4","分组ID2","唯一主ID"];
goodsgroup[2] = ["5","分组ID1","唯一主ID"];
goodsgroup[3] = ["5","分组ID2","唯一主ID"];
goodsgroup[4] = ["6","分组ID1","唯一主ID"];
goodsgroup[5] = ["6","分组ID2","唯一主ID"];
goodsgroup[6] = ["7","分组ID1","唯一主ID"];
goodsgroup[7] = ["7","分组ID2","唯一主ID"];
选尺码或颜色都需要对比的。 我的JS，现在有问题，选择尺码后，颜色有几个点不上了。
字数太多，发不上来。。
目前流程：
$(function(){
$(".sys_item_spec .sys_item_specpara").each(function(){
var i=$(this);
var p=i.find("ul>li");
p.click(function(){
if(!!$(this).hasClass("selected")){
$(this).removeClass("selected");
i.removeAttr("data-attrval");
}else{
$(this).addClass("selected").siblings("li").removeClass("selected");
i.attr("data-attrval",$(this).attr("id"));
}
getgoodid() //输出，方法里实现选项。
})
})
//获取对应属性
function getgoodid(){}
没时间找妹子，哪有时间看这一坨一坨的
建议你搞个codepen或者jsfiddle，开源中国的那个在线编辑器也不错
这样也方便交流，调试。
尝试一下：
这个尺寸和颜色的联动，如何建立尺寸和颜色对应关系，以方便js操作是设计关键
http://jsfiddle.net/xcchcaptain/11ez4ce5/1/
还有些待完善的，也不知能否帮到你追问
单对单实现的，只针对点击 size才行。。首次我就实现了，现在是选择后，有1或多个属性不能点击，如问题中的图类似。