在复选框选中操作上显示第二个元素答案

【问题标题】：Show second element on checkbox checked action在复选框选中操作上显示第二个元素
【发布时间】：2014-10-09 05:14:44
【问题描述】：

我有一个基于复选框选择显示/隐藏（切换）div 的代码。代码很简单：

$(function () {
    $('#sucursal').on('click', function () {
        $("#rifEmpresa").toggle(!this.checked);
        $("#rifSucursal").toggle(this.checked);
    });
});

这有效，因为div#rifEmpresa 是隐藏的，div#rifSucursal 在选中复选框时显示，反之亦然。现在我有一个附加条件，当我检查 checkbox#chkRif 时，我需要显示 div#rifEmpresa 所以我已经完成了这段代码：

$(function () {
    $('#sucursal').on('click', function () {
        $("#rifEmpresa").toggle(!this.checked);
        $("#rifSucursal").toggle(this.checked);
    });

    $('#chkRif').on('click', function () {
        if (this.checked) {
            $("#rifEmpresa").removeAttr('style');
        } else {
            $("#rifEmpresa").attr('style', 'display:none');
        }
    });
});

但它不起作用。我尝试了几种方法：使用$("#rifEmpresa").toggle(this.checked)，使用$("#rifEmpresa").show() / $("#rifEmpresa").hide()，但都没有。我设置了一个Fiddle 用于测试目的，我做错了什么？

【问题讨论】：

标签： javascript jquery html checkbox

【解决方案1】：

JSFiddle - DEMO

$(function () {
    $('html').addClass('fuelux');

    //------ Toggle Sucursal Field
    $('#sucursal').on('click', function () {
        $("#rifEmpresa").toggle(!this.checked);
        $("#rifSucursal").toggle(this.checked);

        // ------ Turn rifSucursal search input in Select2 element
        $("#filtro").select2();
    });

    //------ Toggle Sucursal Field
    $('#chkRif').on('click', function () {
        if ($('input#chkRif').is(':checked')) {
            $("#rifEmpresa").removeAttr('style');
        } else {
            $("#rifEmpresa").attr('style', 'display:none');
        }
    });
});

【讨论】：

【解决方案2】：

你需要这个

更新了 FIDDLE

http://jsfiddle.net/h0qgduuh/3/

$(function () {
    $('html').addClass('fuelux');

    //------ Toggle Sucursal Field
    $('#sucursal').on('click', function () {
        $("#rifEmpresa").toggle(!this.checked);
        $("#rifSucursal").toggle(this.checked);

        // ------ Turn rifSucursal search input in Select2 element
        $("#filtro").select2();
    });

    //------ Toggle Sucursal Field
    $('#chkRif').on('click', function () {
        if (this.checked) {
            $("#rifEmpresa").removeAttr('style');
        } else {
            $("#rifEmpresa").attr('style', 'display:block');//changed display:none to display:block
        }
    });
});

【讨论】：