Question

我试图通过jQuery切换一些自定义元框的可见性。我设法默认隐藏它们，并在点击正确的帖子格式时使它们可见。

当用户更改帖子格式时，我找不到使元框消失的解决方案。

e.g。默认值：隐藏点击“旁白”：显示从“旁白”切换到任何其他帖子格式：隐藏。

我有以下代码：

jQuery(document).ready(function () {
    jQuery("#postbox-container-2").addClass("hidden");

    if (jQuery("input#post-format-video").is(':checked')) {
        jQuery("#postbox-container-2").removeClass("hidden");
    }

    jQuery("input#post-format-video").change(function () {

        if (jQuery(this).is(':checked')) {
            jQuery("#postbox-container-2").removeClass("hidden");
        }
    });

});

有什么想法吗？

基于@zipp小提琴的不同方法

Query(document).ready(function() {
    jQuery( "#postbox-container-2" ).hide();
    var toToggle='';
    jQuery('input#post-format-video').change(function() {
        if (toToggle){
        jQuery(toToggle).hide();
        }

            //alert(this.value+ " is checked");
            var selector='#postbox-container-2';
            jQuery(selector).toggle();     
            toToggle=selector;       
    });
});

即使这个工作正常，但当我点击另一个单选按钮

时也不会改变

Answer 1

以下是您的示例jsfiddle。触发更改事件only on the checked input。当针对特定输入取消选中时，不会触发它。为了知道您的特定输入是否未选中，您需要测试所选输入是否属于您的输入：$(this).attr('id') == 'post-format-video'并执行您的操作。在我的示例中，我使用$('input:radio[name=myRadio]')选择无线电输入，因此您需要调整html和代码以获得正确的选择器。

//This selector is triggered when my radio is selected for all input radio that I want to listen to
$('input:radio[name=myRadio]').change(function() {
        //if we have a radio button selected previously we hide the div related
        if (toToggle){
        $(toToggle).hide();
        }
        //select the div we want to show
        var selector;
        if ($(this).attr('id')=='post-format-video'){
        selector='#postbox-container-2';
        }
        ...
        //show it (could have called toggle() )
        $(selector).show();
        //store it for the next selection     
        toToggle=selector;

使用jQuery显示隐藏自定义元变量

1 个答案: