Question

我通过asp控件执行此操作，当选中复选框时，我希望它显示if yes ..当取消选中时我希望它显示if no，并隐藏if yes

我已经完成了以下javascript，但我不太清楚为什么它不起作用：

<script>
    var checkboxTest = document.getElementById('cbIsthereanofficialofVETmobilityinthecountry');
    var hide = document.getElementById(hide);
    var show = document.getElementById(show);
    if (checkboxTest.checked) {
        hide.style.display = 'block';
        show.style.display = 'none';
    } else {
        hide.style.display = 'none';
        show.style.display = 'block';
    }

</script>

控件是：

<uc1:CheckBox runat="server" class="CheckBox123" ID="cbIsthereanofficialofVETmobilityinthecountry"  LabelWidth="645" Width="50" />

       <div id="show" runat="server" clientidmode="Static" style="display: none;">
           <uc1:TextBoxBootstrap runat="server" Height="50" ID="txtIsthereanofficialofVETmobilityinthecountryifyes" />
       </div>

       <div id="hide" class="hidetest" runat="server" clientidmode="Static" style="display: none;">
           <uc1:TextBoxBootstrap runat="server" Height="50" ID="txtIsthereanofficialofVETmobilityinthecountryifno" />
       </div>

感谢任何帮助：）

Answer 1

您需要在复选框上有一个事件处理程序，当您切换复选框时应触发该处理程序。并且所有代码都应该在其回调中。

document.getElementById(hide);

hide应该是字符串。

请参阅以下代码：

var checkboxTest = document.getElementById('cbIsthereanofficialofVETmobilityinthecountry');

checkboxTest.addEventListener( 'change', function() {
    var hide = document.getElementById("hide");
    var show = document.getElementById("show");
    if(this.checked) {
        hide.style.display = 'block';
        show.style.display = 'none';
    } else {
        hide.style.display = 'none';
        show.style.display = 'block';
    }
});

Javascript - 选中复选框后切换2 div

1 个答案: