jQuery .show()方法在.hide之后不起作用 [英] JQuery .show() method not Working After .hide

问题描述

我正在使用一个JQuery脚本，该脚本允许一个复选框(其类名为"adminCheckBox")根据是否选中它来在屏幕上显示或隐藏各种对象.

I am working with a JQuery script that allows a checkbox (its class name is "adminCheckBox") to show or hide various objects on the screen based on whether or not it is checked.

隐藏功能可以正常工作.但是，在元素被隐藏并再次按下复选框后，元素不再出现.是否有任何关于为什么会这样的想法?谢谢.

The hiding function works fine. However, after the elements have been hidden and I press the checkbox again, the elements do not appear again. Are there any ideas as to why this may be? Thank you.

$(document).ready(function(){

$(".adminCheckbox").click(function(){

           if(!document.getElementsByClassName("adminCheckBox").checked){

            $(".deleteImageButton").hide(500);
            $(".addHeading").hide(500);
            $(".deleteHeadingButton").hide(500);
            $(".fileUpload").hide(500);
            $(".fileUploadSubmit").hide(500);    

           }else{

            $(".deleteImageButton").show();
            $(".addHeading").show();
            $(".deleteHeadingButton").show();
            $(".fileUpload").show();
            $(".fileUploadSubmit").show();    

           }    

        }); 
        });

下面是该复选框的HTML.

Below is the HTML for the checkbox in question.

        <br><div class="adminControls"><input type="checkbox" class="adminCheckbox"         checked="checked"><div class="checkBoxText">&nbsp;&nbsp;Admin Controls</div></div>

推荐答案

我强烈建议您仅使用 .toggle() 代替.这样就可以大大缩短代码.另外，如果需要，可以通过为所有这些元素提供相同的类来进一步优化它.

I strongly recommend just using .toggle() instead for this. Shorten up the code a lot just with that. Also, you can further optimize it just by giving all those elements a same class, if you want.

$(".adminCheckbox").click(function(){

    $(".deleteImageButton, .addHeading, .deleteHeadingButton, .fileUpload, .fileUploadSubmit").toggle();

}); 

您还可以放置一个数字值以进行切换，以在隐藏和显示动画上进行操作，例如.toggle(500)

You can also place a number value for toggle to do an animation on hide and show, like .toggle(500)

这篇关于jQuery .show()方法在.hide之后不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！