2

我在一组中有两个单选按钮。如果您通过 html 中的“检查”访问该页面，则会检查第一个。

我想使用javascript来调整一些css（通过javascript，而不是通过添加一个类）。So if the first is selected, I want a certain class to get a display:noneand an other class a display:block, but when the second radio button is selected, I want the the same as with the other radio button only and vice versa.

我的html是：

<li><input type="radio" name="kosten" id="maand" checked><label for="maand">per maand</label></li>
<li><input type="radio" name="kosten" id="jaar" ><label for="jaar">per jaar</label></li>

我尝试了一些 jquery，但我真的不擅长它。

if ($('input#maand').is(':checked'){
$('.bedrag-jaar').css('display', 'none');
}

div我想出现和消失的 s 的一些例子。

<li><strong><span class="bedrag-maand">some text</span> <span class="bedrag-jaar">some other text</span></strong></li>

你知道我怎么能让这个工作吗？

4

2 回答 2

1

尝试类似的东西

jQuery(function(){
    var $spans = $('span[class*="bedrag"]').hide();
    $('input[name="kosten"]').change(function(){
        $spans.hide();
        $spans.filter('.bedrag-' + this.id).show();
    })
})

演示：小提琴

bedrag-*如果您可以向元素添加一个额外的类，它可以做得非常强大，例如

<li><strong><span class="bedrag bedrag-maand">some text</span> <span class="bedrag bedrag-jaar">some other text</span></strong></li>

然后

jQuery(function(){
    var $spans = $('.bedrag').hide();
    $('input[name="kosten"]').change(function(){
        $spans.hide();
        $spans.filter('.bedrag-' + this.id).show();
    })
})

演示：小提琴

于 2013-10-18T09:48:10.807 回答
1

这是代码，试试这个：

$( "input[type=radio]" ).on( "click",function(){
    if ($('#maand').is(':checked')){
        $('.bedrag-maand').css('display', 'block');
        $('.bedrag-jaar').css('display', 'none');
    } else {
        $('.bedrag-jaar').css('display', 'block');
        $('.bedrag-maand').css('display', 'none');
    }
});

JSFIDDLE

于 2013-10-18T10:12:05.643 回答