Jquery 隐藏/显示销毁所选插件 CSS

Question

<script>
$(document).ready(function(e) {
    $("#b").hide();
    $(".chosen").chosen();

    $("#a").click(function(){$("#b").show();});
});
</script>

<p id="a">aaaa</p>

<div id="b">
<select class="chosen">
<option>Classification</option>
<option>aaaa</option>
<option>bbb</option>
</select>
</div>

我已经选择下拉列表使用选择的插件。但是，当我尝试隐藏表单并使用单击显示表单时，所选的 css 布局将被破坏。

有人知道如何解决这个问题吗？

这是 fiddle :

http://jsfiddle.net/cZV6G/

Answer 1

是的，您可以尝试设置元素的可见性。

要解决此问题，您可以使用 visibility:hidden 而不是 .hide() 并显示下拉菜单，使用 visibility:visible而不是 .show()。

试试这个代码:

$(document).ready(function(e) {
    $("#b").css('visibility','hidden');
    $(".chosen").chosen();
    $("#a").click(function(){$("#b").css('visibility','visible');});
});

Try is jsfiddle

更新:解决可见性问题

jquery.hide()没有问题。真正的问题是，您在应用 .chosen() 之前隐藏了元素。但是，如果您在应用 .chosen() 后尝试隐藏元素，那么它会正常工作。

$(document).ready(function(e) {
    $(".chosen").chosen();
    $("#b").hide();
    $("#a").click(function(){$("#b").show();});
});

Try with .hide()