仿淘宝商品尺寸选择功能

[troy-zhou]

仿淘宝商品颜色尺寸选择功能

[furyacted]

这个。。。不就是javascript吗？

[cpp2017]

lz是求源码吧？

[young5335]

给米就做.哈

[troy-zhou]

是啊，有源码更好

[娃都会打酱油了]

$(document).ready(function() {
            getNum();
            $("li[value] > a").click(function() {
                if ($(this).hasClass("asd")) {
                    $(this).removeClass("asd");
                }
                else {
                    $(this).addClass("asd");
                    $(this).parent().siblings().children("a").removeClass("asd");
                }
                getNum();
                return false;
            });

            $("#txtBuyNum").change(function() {
                var buyNum;
                var isfloat = $("#txtBuyNum")[0].getAttribute("db") != "0";
                if (isfloat) {
                    buyNum = parseFloat($("#txtBuyNum")[0].value);
                }
                else {
                    buyNum = parseInt($("#txtBuyNum")[0].value);
                }
                if (isNaN(buyNum)) {
                    $("#txtBuyNum")[0].value = "1";
                }
                else {
                    if (isfloat) {
                        var splitStr = (buyNum + "").split('.');
                        if (splitStr.length > 1) {
                            if (splitStr[1].length >= 2) {
                                $("#txtBuyNum")[0].value = buyNum.toFixed(2);
                                return;
                            }
                        }
                    }
                    $("#txtBuyNum")[0].value = buyNum;
                }
            });

            //定义验证输入的方法
            var formCheck = function() {
                var sku = "";
                var allprop = $("ul[value]");
                if (allprop.length > 0) {
                    var selectprop = $("li[value] > a[class=asd]").parent().parent();

                    if (allprop.length > selectprop.length) {
                        var errormessage = "请选择：";
                        for (i = 0; i < allprop.length; i++) {
                            var ishas = false;
                            for (j = 0; j < selectprop.length; j++) {
                                if (allprop[i].getAttribute("value") == selectprop[j].getAttribute("value")) {
                                    ishas = true;
                                    break;
                                }
                            }
                            if (!ishas) {
                                errormessage += allprop[i].getAttribute("value") + "  ";
                            }
                        }
                        alert(errormessage);
                        return false;
                    }

                    var selsku = $("li[value] > a[class=asd]").parent();

                    for (var i = 0; i < selsku.length; i++) {
                        sku += selsku[i].getAttribute("value");
                        if (i == 0) {
                            sku = sku.replace(":", "");
                        }
                    }
                }


                var buyNum;
                if ($("#txtBuyNum")[0].getAttribute("db") != "0") {
                    buyNum = parseFloat($("#txtBuyNum")[0].value);
                }
                else {
                    buyNum = parseInt($("#txtBuyNum")[0].value);
                }

                if (isNaN(buyNum)) {
                    alert("请输入正确的购买数量");
                    return false;
                }

                var stock = parseFloat($("#spStockNum")[0].innerText);

                if (stock < 0.001) {
                    alert("当前商品无库存");
                    return false;
                }
                if (buyNum > stock) {//购买数量与库存量的比较
                    alert("购买数量超过库存");
                    return false;
                }

                var addStr = "&number=" + buyNum;
                if (sku != "") {
                    addStr += "&sku=" + sku;
                }
                $("#linkAdd")[0].href += addStr;

                return true;
            };

            $("#linkBuy").click(formCheck);
            $("#linkAdd").click(formCheck);

        });

        function getNum() {
            if ($("#dlChoice").length > 0) {
                var dds = $("#dlChoice > dd")[0];
                dds.innerText = "";
                var dom1 = $("li[value] > a[class=asd]").parent();
                var dom2 = $("ul[value]");
                if (dom1.length > 0) {//当有选择时
                    $("#dlChoice > dt")[0].innerText = "已选择：";
                    var selectString = "";
                    for (i = 0; i < dom1.length; i++) {
                        selectString += dom1[i].getAttribute("value");
                        dds.innerText += dom1[i].parentElement.getAttribute("value") + "  ";
                    }

                    if (dom1.length == dom2.length) { //所有销售属性都选择过后,获取库存
                        selectString = selectString.substr(1);
                        var stock = $('#<%=hiddenPV.ClientID %>')[0].value.split(';');
                        for (i = 0; i < stock.length; i++) {
                            var details = stock[i].split(',');
                            if (details[0] == selectString) {
                                $("#lblPrice")[0].innerText = details[2];
                                $("#spStockNum")[0].innerText = details[1];
                                break;
                            }
                        }
                    }
                    else {
                        $("#lblPrice")[0].innerText = $("#lblPrice")[0].getAttribute("range");
                        $("#spStockNum")[0].innerText = $("#spStockNum")[0].getAttribute("range");
                    }
                }
                else {
                    $("#dlChoice > dt")[0].innerText = "请选择：";
                    for (i = 0; i < dom2.length; i++) {
                        dds.innerText += dom2[i].getAttribute("value") + "  ";
                    }
                }
            }
        }

[code=HTML]<div class="shop-main-right">
<input name="hiddenPV" type="hidden" id="hiddenPV" value="001001:008001,6,2500.00;0010010:008001,8,1800.00;0010010:008002,9,2000.00" />
<div class="myGoods">
<div id="divGoodName" class="goodName">红星美凯龙手机</div>
<div class="goodsInfo">
<div class="goodsPic">
<img id="imgGood" src="UpLoadFolder/132028100012/images/9.jpg" style="border-width:0px;" />
</div>
<div id="divSell" class="goodsBuy"><dl>
<dt>
价格：
</dt>
<dd>
<span id="lblPrice" range="1800.00 - 2500.00">1800.00 - 2500.00</span> 元</dd>
</dl>
<dl>
<dt>颜色：</dt>
<dd>
<ul value="颜色"><li value=":001001">
<a href="#">
红色
</a>
<li value=":0010010">
<a href="#">
银白色
</a>
</ul>
</dd>
</dl>
<dl>
<dt>操作系统：</dt>
<dd>
<ul value="操作系统"><li value=":008001">
<a href="#">
iPhone
</a>
<li value=":008002">
<a href="#">
黑莓
</a>
</ul>
</dd>
</dl>
<dl>
<dt>
购买数量：
</dt>
<dd>
<input id="txtBuyNum" type="text" value="1" db="0" maxlength="8"/>
<em>(库存<span id="spStockNum" range="23">23</span>)</em>
</dd>
</dl>
<dl id="dlChoice">
<dt>
请选择：
</dt>
<dd>
</dd>
</dl>
<div>
<div >
<a id="linkAdd" class="andCar" href="ShoppingCart.aspx?id=132028100012000000">
</a>
</div>
</div>
</div>
[code]
当组合不存在时会有问题，暂时没空解决

[娃都会打酱油了]

jquery部分你就随便看看吧。。。。
第一次用时写的。。。。还是写的比较垃圾的