效果:
js代码:
function changeAtt(t,src,key) {
document.getElementById('spec_value_'+src).checked='checked';
div = document.getElementById("EXP_"+key);
elems = div.getElementsByTagName("dd")[].getElementsByTagName("a"); for(i=;i<elems.length;i++){
elems[i].className='';
}
t.className = "on"; changePrice(); /*每次调整价格 都需要用到的*/
}
扩展参数:经过服务器解析
<div class="gdExp-cs" id="EXP_1"> <dd>
<a href="javascript:" name="spec_1" class="" onclick="changeAtt(this,1,1)">无内存卡 <span></span></a>
<input type="radio" name="spec_1" value="" id="spec_value_1" checked="" onclick="changePrice()" style="display: none">
<a href="javascript:" name="spec_1" onclick="changeAtt(this,3,1)" class="on">16G <span></span></a>
<input type="radio" name="spec_1" value="" id="spec_value_3" onclick="changePrice()" style="display: none">
<a href="javascript:" name="spec_1" onclick="changeAtt(this,2,1)" class="">32G <span></span></a>
<input type="radio" name="spec_1" value="" id="spec_value_2" onclick="changePrice()" style="display: none">
<a href="javascript:" name="spec_1" onclick="changeAtt(this,4,1)" class="">8G <span></span></a>
<input type="radio" name="spec_1" value="" id="spec_value_4" onclick="changePrice()" style="display: none">
</dd>
<input type="hidden" name="spec_list" value=""> </div>
扩展参数:原代码
<div class="gdExp-cs" id="EXP_{$spec_key}">
<!-- {* 判断属性是复选还是单选 *} -->
<!-- {if $spec.attr_type eq } -->
<!-- {if $cfg.goodsattr_style eq } -->
<dd >
<!-- {foreach from=$spec.values item=value key=key} -->
<a href="javascript:" name="spec_{$spec_key}" {if $key eq }class="on"{/if} onclick="changeAtt(this,{$value.id},{$spec_key})">{$value.label} <span></span></a>
<input type="radio" name="spec_{$spec_key}" value="{$value.id}" id="spec_value_{$value.id}" {if $key eq }checked{/if} onclick="changePrice()" style="display: none"/>
<!-- {/foreach} -->
</dd>
<!-- {/foreach} -->
<!-- {/if} -->
</div>