javascript - 在 Bootstrap 3 SlideDown() 隐藏元素上有问题

Question

你能看看this demo吗？让我知道为什么 change() 函数无法 slideDown() Bootstrap 3 中的 hidden 元素？

这是我的代码

$(function() {
    $('input:radio').change(function() {
        if($(this).val()== 'Dog') {
            $('#hidden-list-1').slideDown();
        }
        if($(this).val()== 'Bird'){
            $('#hidden-list-2').slideDown();  
        }
    });
});

Answer 1

正如其他答案已经提到的，问题是 boostrap 有这样的风格

.hidden{
  display: none !important;
}

解决这个问题的一种方法是删除隐藏类。

$('#hidden-list-1').hide().removeClass('hidden').slideDown();

这是一个演示 https://jsfiddle.net/dhirajbodicherla/zzdL5jp7/3/