1

jQueryを使用して、選択チェックボックスボタンを設定しようとしています。選択チェックボックスボタンは(opt2)DIVを非表示にし、チェックボックスの選択を解除してから、divを表示します。ほとんどの機能が動作していますが、非表示の DIV を表示することができず、unSelect が選択されていません。これまでの私のコードは次のとおりです。

<style type="text/css">
    .desc{ display: none; }
</style>

<div> Delivery Details</div>
<label><input type="checkbox" name="group1" value="opt2">Same as Billing Details</label>
<div id="opt2" class="desc"> Billing Details Form</div>


$(document).ready(function(){ 
    $("input[name$='group1']").click(function() {
        var test = $(this).val();
        $("div.desc").show();
        $("#"+test).hide();
    }); 
});

私に何ができる？

4

4 に答える 4

2

.descクラス（ ）を介して常に両方のdivを表示し、2番目を非表示にしています。最初のものを非表示にすることはありません。2 回クリックした後でも、使用しているため表示されたままになりますshow()。

交換$("div.desc").show();

と$("div.desc").toggle();

これはshow()状態を切り替えます。最初にクリックすると表示され、次に非表示になります。

ここでjsFiddle。

于 2013-06-04T19:14:53.553 に答える
1

これを試してください

$("input[name$='group1']").click(function () {
    $("div.desc").toggle(this.checked);
});

この以前の Stackoverflow の投稿を参照してください

于 2013-06-04T19:15:38.797 に答える
0 
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style type="text/css">
    .desc{ display: none; }
</style>
</head>

<body>
<script src = "jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){ 
    $("input[name$='group1']").click(function() {
        var test = $(this).val();
        if($("div.desc").css('display') == 'none')
            $("div.desc").css('display','block');
        else if($("div.desc").css('display') == 'block')
            $("div.desc").css('display','none');
            //$("#"+test).hide();
    }); 
});
</script>
<label><input type="checkbox" name="group1" value="opt2">opt1</label>

<div id="opt1" class="desc">lorem ipsum dolor</div>
<div id="opt2" class="desc">consectetur adipisicing</div>
</body>
</html>
于 2013-06-04T19:18:58.413 に答える