Jquery仿淘宝SKU商品添加属性代码



215 857 286



特效描述:商品添加属性,Jquery模拟淘宝SKU添加组合

代码结构

1. 引入CSS

<link type="text/css" rel="stylesheet" href="liandong.css">

2. 引入JS

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/liandong.js"></script>

3. HTML代码

<div id="navtab1" style="width: 100%; border: 1px solid #A3C0E8;">
    <div title="扩展信息" tabid="tabItem3">
        <div id="Div1">
            <div position="center">
                <div style="padding: 5px 8px;" class="div_content">
                    <div class="div_title"><span>产品规格</span></div>
                    <div class="div_contentlist">
                        <ul class="Father_Title"><li>颜色分类</li></ul>
                        <ul class="Father_Item0">
                            <li class="li_width"><label><input id="Checkbox3" type="checkbox" class="chcBox_Width" value="军绿色" />军绿色<span class="li_empty"  contentEditable="true"></span></label></li>
                            <li class="li_width"><label><input id="Checkbox1" type="checkbox" class="chcBox_Width" value="花色" />花色<span class="li_empty"> </span></label></li>
                            <li class="li_width"><label><input id="Checkbox2" type="checkbox" class="chcBox_Width" value="蓝色" />蓝色<span class="li_empty"> </span></label></li>
                            <li class="li_width"><label><input id="Checkbox4" type="checkbox" class="chcBox_Width" value="褐色" />褐色<span class="li_empty"> </span></label></li>
                            <li class="li_width"><label><input id="Checkbox5" type="checkbox" class="chcBox_Width" value="黄色" />黄色<span class="li_empty"> </span></label></li>
                            <li class="li_width"><label><input id="Checkbox6" type="checkbox" class="chcBox_Width" value="黑色" />黑色<span class="li_empty"> </span></label></li>
                        </ul>
                        <br/>
                        <ul class="Father_Title"><li>尺寸</li></ul>
                        <ul class="Father_Item1">
                            <li class="li_width"><label><input id="Checkbox7" type="checkbox" class="chcBox_Width" value="41" />41<span class="li_empty"> </span></label></li>
                            <li class="li_width"><label><input id="Checkbox8" type="checkbox" class="chcBox_Width" value="42" />42<span class="li_empty"> </span></label></li>
                            <li class="li_width"><label><input id="Checkbox9" type="checkbox" class="chcBox_Width" value="43" />43<span class="li_empty"> </span></label></li>
                        </ul>
                        <br/>
                        <ul class="Father_Title"> <li>类型</li></ul>
                        <ul class="Father_Item2">
                            <li class="li_width"><label><input id="Checkbox10" type="checkbox" class="chcBox_Width" value="港澳台" /><span class="Color_Name">港澳台</span><span class="li_empty"> </span></label></li>
                            <li class="li_width"><label><input id="Checkbox11" type="checkbox" class="chcBox_Width" value="韩国" />韩国<span class="li_empty"> </span></label></li>
                            <li class="li_width"><label><input id="Checkbox12" type="checkbox" class="chcBox_Width" value="亚太" />亚太<span class="li_empty"> </span></label></li>
                        </ul>
                        <br/>
                        <ul class="Father_Title"> <li>品牌</li></ul>
                        <ul class="Father_Item3">
                            <li class="li_width"><label><input id="Checkbox13" type="checkbox" class="chcBox_Width" value="森马" />森马<span class="Color_Name"></span><span class="li_empty"> </span></label></li>
                            <li class="li_width"><label><input id="Checkbox14" type="checkbox" class="chcBox_Width" value="特步" />特步<span class="li_empty"></span></label></li>
                            <li class="li_width"><label><input id="Checkbox15" type="checkbox" class="chcBox_Width" value="361" />361<span class="li_empty"></span></label></li>
                        </ul>
                        <br/>
                    </div>
                    <div class="div_contentlist2">
                        <ul>
                            <li><div id="createTable"></div></li>
                        </ul>
                        <ul><li><input type="button" id="Button1" class="l-button" value="提交"/></li></ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>



用户评论
大牛,别默默的看了,快登录帮我点评一下吧!:)      登录 | 注册


热门标签: 右键菜单 图片头像上传 文字提示框 文件上传 提示框/弹出层 文本框 layer 下拉框 lightbox 复选 单选 Tooltip工具提示框 登录框 浮动提示框 注册框 html5弹窗动画 搜索框 验证码 二级联动 三级联动 城市选择 value赋值 筛选 按钮控制 购物车 颜色选择 表单提交 全选/反选 添加删除 添加标签 密码强度验证 表单验证 html5按钮动画 按钮样式 密码修改设置 弹出层拖动 窗口提示框 切换按钮 form表单

×
×

注册

官方QQ群

扫描上面二维码加微信群

官方QQ群

jQuery/js讨论群
群号:642649996
Css3+Html5讨论群
群号:322131262

加群请备注:从官网了解到