猿问

怎样实现div单选

我想做一个淘宝默认地址选中,选中一个div,就赋为选中状态,没有选中的则为默认状态

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8">
    <script type="text/javaScript" src="jquery.js"></script>
    <style type="text/css">
.addressBox{width:200px; height:100px; background:#ccc; margin-top:20px;cursor: pointer;}
.addressBox img{padding-top:30px;}
.setDefault{display: block;}
.default{display: none;}
    </style>
    <script>
        $(function(){
            $(".addressBox").click(function(){
                $(".addressBox>.setDefault").hide();
                $(".addressBox>.default").show();
            })
        })
    </script>
</head>
<body>
<div class="addressBox" id="box1">
    <img class="setDefault" src="img/setDefault.png">
    <img class="default" src="img/default.png">
</div>

<div class="addressBox" id="box2">
    <img class="setDefault" src="img/setDefault.png">
    <img class="default" src="img/default.png">
</div>

<div class="addressBox" id="box3">
    <img class="setDefault" src="img/setDefault.png">
    <img class="default" src="img/default.png">
</div>

</body>
</html>

ok_bye
浏览 2202回答 3
3回答

玩意11

<script>        $(function(){            $(".addressBox").click(function(){                $(this).children(".setDefault").toggle();                $(this).children(".default").toggle();            })        })    </script>jquery改成这样看看吧,不知道你是不是要这个效果

susan100

<script>        $(function(){            $(".addressBox").click(function(){                $(this).children(".setDefault").toggle();                $(this).children(".default").toggle();            })        })    </script>就是这样

印仔

你这不是给div中的图片添加了显示和隐藏么,这也不是整体的div啊。可以写两个css样式,选中时用样式1,没选中的用样式2!
随时随地看视频慕课网APP
我要回答