Question

我正在使用以下代码根据给出的答案隐藏文本。它是如此简单，但我必须缺少一些东西。我在做什么错了？

$('.nameclass').on('change', function() {
        if( $('input[name=idname]').val() == '1' ) {
        $('#idname').removeClass('hide');
        } else {
            $('#idname').addClass('hide');
        }
    });


        <div class="hide" id="idname"> 
             <legend>To be hidden depending on answer</legend>
        </div>
    </div>

Answer 1

您的select选择器不正确。在侦听器选择器中，没有tenaamstellingclass分配给选择框的类。在if语句中，当您应该像input[name=tenaamstelling]这样使用它时，尝试使用select[name=tenaamstelling]来获得选择框，因为它是一个选择框而不是输入字段。

您可以将tenaamstellingclass类添加到select输入中，或使用此代码。

只需替换一下：

$('.tenaamstellingclass').on('change', function() {
    if( $('input[name=tenaamstelling]').val() == 'VOLMACHT' ) {
    $('#tenaamstelling_volmacht').removeClass('hide');
    } else {
        $('#tenaamstelling_volmacht').addClass('hide');
    }
});

具有：

$('select[name="tenaamstelling"]').on('change', function() {
    if( $(this).val() == 'VOLMACHT' ) {
        $('#tenaamstelling_volmacht').removeClass('hide');
    } else {
        $('#tenaamstelling_volmacht').addClass('hide');
    }
});

现在，如果在您的CSS中正确定义了.hide，一切都会很好

您可以在此处检查它：

https://jsfiddle.net/vk3o6gyc/

鉴于您的HTML，#tenaamstelling_volmacht div的默认设置是隐藏的，并且在选择选项2时将显示它。

用jQuery隐藏div

1 个答案: