仿淘宝运费地区设置

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head><title>
 地区分类
</title>
<style type="text/css">
*{ padding:0; margin:0; list-style-type:none;}
body{font-family: "宋体";font-size: 12px;}
#t_con{ width:60px; line-height:20px; color:#00F; cursor:pointer; margin:20px auto 0 auto; border:1px #09C dashed; text-align:center;}
#t_area{ width:268px; overflow:hidden; border:2px #09C solid; background-color:#F1F9FC; margin:10px auto; padding-bottom:10px;display:none; }
#t_area ul{ margin:10px 0;}
#t_area li{ width:60px; height:18px; float:left; display:inline; text-align:center; line-height:18px; margin:4px auto auto 5px; }
#t_area li a{ color:#00F; text-decoration:none;}
#t_area li a:hover,a:active{ color:#fff; text-decoration:underline;}
</style>
<script type="text/javascript">
    function showarea() {
        var con = document.getElementById("t_area");
        var arealist = con.getElementsByTagName("li");
        var g = document.getElementById("t_con")
        con.style.display = "block";
        for (var i = 0; i < arealist.length; i++) {
            arealist[i].onmouseover = function() { this.style.backgroundColor = "#9CC2DA" }
            arealist[i].onmouseout = function() { this.style.backgroundColor = "#F1F9FC" }
            arealist[i].onclick = function() {
                g.innerHTML = this.innerHTML;
                con.style.display = "none";
            }
        }
    }
    function offarea() {
        var con = document.getElementById("t_area");
        con.style.display = "none";
    }
    var timer;
</script>
</head>
<body>
<div id="t_con" οnmοuseοver="showarea();clearTimeout(timer)" οnmοuseοut="timer=setTimeout('offarea()',200);">四川</div>
<div id="t_area" οnmοuseοver="showarea()" οnmοuseοut="offarea();clearTimeout(timer)">
    <ul>
                                 <li><label id="divisions_10000">全国</label></li>
        <li><label id="divisions_110000">北京</label></li>
        <li><label id="divisions_120000">天津</label></li>
        <li><label id="divisions_130000">河北</label></li>
        <li><label id="divisions_140000">山西</label></li>
        <li><label id="divisions_150000">内蒙古</label></li>
        <li><label id="divisions_210000">辽宁</label></li>
        <li><label id="divisions_220000">吉林</label></li>
        <li><label id="divisions_230000">黑龙江</label></li>
        <li><label id="divisions_310000">上海</label></li>
        <li><label id="divisions_320000">江苏</label></li>
        <li><label id="divisions_330000">浙江</label></li>
        <li><label id="divisions_340000">安徽</label></li>
        <li><label id="divisions_350000">福建</label></li>
        <li><label id="divisions_360000">江西</label></li>
        <li><label id="divisions_370000">山东</label></li>
        <li><label id="divisions_410000">河南</label></li>
        <li><label id="divisions_420000">湖北</label></li>
        <li><label id="divisions_430000">湖南</label></li>
        <li><label id="divisions_440000">广东</label></li>
        <li><label id="divisions_450000">广西</label></li>
        <li><label id="divisions_460000">海南</label></li>
        <li><label id="divisions_500000">重庆</label></li>
        <li><label id="divisions_510000">四川</label></li>
        <li><label id="divisions_520000">贵州</label></li>
        <li><label id="divisions_530000">云南</label></li>
        <li><label id="divisions_540000">西藏</label></li>
        <li><label id="divisions_610000">陕西</label></li>
        <li><label id="divisions_620000">甘肃</label></li>

        <li><label id="divisions_630000">青海</label></li>
        <li><label id="divisions_640000">宁夏</label></li>
        <li><label id="divisions_650000">新疆</label></li>
        <li><label id="divisions_710000">台湾</label></li>
        <li><label id="divisions_810000">香港</label></li>
        <li><label id="divisions_820000">澳门</label></li>
        <li><label id="divisions_990000">海外</label></li>
      </ul>
</div>
</body>
</html>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值