0

いくつかのチェックボックスのonClickまたはonSelectのテーブルを表示しようとしています。「標準」のチェックボックスがあり、選択すると標準オプションの表が表示されます。「カスタマイズ」のチェックボックスがあり、選択するとカスタマイズオプションの表が表示されます。

現在、テーブルは切り替わりますが、同時に表示されません。つまり、両方がチェックされている場合、両方のテーブルを上下に表示する必要があります。「標準」のみがチェックされている場合は「標準」オプションのみが表示され、「カスタマイズ」のみがチェックされている場合は「カスタマイズ」オプションのみが表示されます。

ここにフィドルがあります：http：//jsfiddle.net/4tcRD/2/

これが私のJSです：

function toggleTables(which)
{

    if(which == "1") {
        document.getElementById('customize').style.display = "table";
        document.getElementById('standard').style.display = "none";

        }
    if(which == "2") {
        document.getElementById('standard').style.display = "table";
        document.getElementById('customize').style.display = "none";

        }
}

これが私のHTMLです：

<input name="checkbox1" type="checkbox" id="customize_1" onClick="toggleTables('2')" value="checkbox" />
<label for="checkbox1"></label> Standard&nbsp;&nbsp;&nbsp;
<input name="checkbox2" type="checkbox" id="customize_0" onClick="toggleTables('1')" value="checkbox" checked="checked" />
Customize


<br />
<table width="100%" class="imagetable" cellpadding="0" cellspacing="0" id="customize">
    <tr><td>customize</td></tr>                   
</table>

<table width="100%" class="imagetable" cellpadding="0" cellspacing="0" id="standard" style="display: none">
    <tr><td>standard</td></tr>                   
</table>

手を貸してください。-チェックボックスで更新**

4

1 に答える 1

2

関数内のチェックボックスのステータスを確認するだけです。

function toggleTables()
{
    var isCustomize = document.getElementById('customize_1').checked; 
    var isStandard = document.getElementById('standard_1').checked;  

    var customize = document.getElementById('customize'); 
    var standard = document.getElementById('standard');    

    customize.style.display = isCustomize  ? 'table' : 'none';
    standard.style.display = isStandard  ? 'table' : 'none';
}​

http://jsfiddle.net/4tcRD/3/

于 2013-01-02T17:02:16.473 に答える