时间戳

首页 > 解决方案 > 用jquery隐藏div

javascript - 用jquery隐藏div

问题描述

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

$('.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>

标签： javascriptjqueryhtml

解决方案

您的select选择器不正确。在侦听器选择器中，没有为tenaamstellingclass选择框分配类。在 if 语句中，您试图通过使用input[name=tenaamstelling]when 您应该使用它来获取选择框，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');
    }
});

现在，如果.hide在你的 CSS 中正确定义了，一切都应该没问题

你可以在这里查看：

https://jsfiddle.net/vk3o6gyc/

鉴于您的HTML，#tenaamstelling_volmachtDIV的默认值是隐藏的，并且在选择选项2时将显示。

推荐阅读