2

誰かがコマンドで私を助けてくれるかどうか疑問に思っていました。

次のスクリプトがある場合：

<script type="text/javascript">
function show_table(id){
  document.getElementById('table1').style.display='none';
  document.getElementById('table2').style.display='none';
  document.getElementById('table3').style.display='none';
  document.getElementById('table4').style.display='none';
  document.getElementById('table6').style.display='none';
  document.getElementById('table'+id).style.display='block';
}
</script>

そして、私が持っているテーブルは問題なく表示されますが、コマンドを使用して2つのテーブルを同時に開きたいので、以下の参照リンクを1回クリックします。

<a href="#" onclick="show_table(6)">Table6</a>

double onclick="" コマンドで使用することは可能ですか? 例として table(6) と table(2) を開きたいと思います。何を書けばいいですか？ちなみに私はjavascriptしか使えず、PHPは使えません。

私はこのようなことを試しましたが、仕事をしません

<a href="#" onclick="show_table(6),show_table(2)">Table6 and Table2</a>
4

6 に答える 6

2

数値または配列を取ることができるこのバージョンを試してください：

function show_table(id) {
    var ix;

    for (ix = 1;  ix <= 6;  ++ix) {
        document.getElementById('table' + ix).style.display='none';
    }
    if (typeof id === "number") {
        document.getElementById('table'+id).style.display='block';
    } else if (id && id.length) {
        for (ix = 0;  ix < id.length;  ++ix) {
            document.getElementById('table'+ix).style.display='block';
        }
    }
}

次に、show_table(1) の代わりに show_table([1, 2]) と言うことができます。

于 2012-09-13T16:07:17.020 に答える
1 
    function show_table(ids) {
        var idArr = ids.split(",");
        document.getElementById('table1').style.display='none';
      document.getElementById('table2').style.display='none';
      document.getElementById('table3').style.display='none';
      document.getElementById('table4').style.display='none';
      document.getElementById('table6').style.display='none';

        for(var i = 0; i< idArr.length; i++) {
            document.getElementById('table'+idArr[i]).style.display='block';
        }
    }

<a href="#" onclick="show_table('6,2')">
于 2012-09-13T16:07:30.627 に答える
1

最小の力のアプローチを好む場合は、これを試してください。

function hide_all_tables(){
    document.getElementById('table1').style.display='none';
    document.getElementById('table2').style.display='none';
    document.getElementById('table3').style.display='none';
    document.getElementById('table4').style.display='none';
    document.getElementById('table6').style.display='none';
}

function show_table(id){
    document.getElementById('table'+id).style.display='block';
}

そして、次のようにコードを使用します。

<a href="#" onclick="hide_all_tables();show_table(6);show_table(2);">Table6 and Table2</a>
于 2012-09-13T18:31:38.423 に答える
0

私は「ダブル onclick コマンド」を使用したことがなく、正直なところ、それらが機能するとは思いませんし、良い習慣だとも思いません。両方の show table コマンドを JavaScript 関数に格納して、関数 onclick を呼び出してみませんか?

私があなたを正しく理解しているなら。

于 2012-09-13T16:06:46.933 に答える
0

テーブルに論理的な関連付けがある場合は、ループせずに一度にすべてを変更できます(必須ですよね?)。

アイデアは、それらにクラス (または複数のクラス) を割り当て、クラス全体を一度に変更することです。

<script>
function f(classname, show)
{
    var mysheet=document.styleSheets[0];

    /* Each class in the styleSheet is called a 'rule' */
    var myrules=mysheet.cssRules;

    var value = show ? '' : 'none'; /* show or hide? */
    for (i=0; i<myrules.length; i++){

        /* find the class we want to change */
        if(myrules[i].selectorText==classname){
            /* change the rule */
            myrules[i].style.display = value;
        }
    }
}
</script>

<style type="text/css" >
.hasPets { color: green; display: none; }
.hasCats { font-weight: bold; display: none; }
</style>

​&lt;button onclick="f('.hasPets', true)">Show Pets</button>
​&lt;button onclick="f('.hasCats', true)">Show Cats</button>
​&lt;button onclick="f('.hasPets', false)">Hide Pets</button>
​&lt;button onclick="f('.hasCats', false)">Hide Cats</button>

<div class="hasPets">Pets</div>
<div class="hasCats hasPets">Cats</div>

この例でShow Petsは、両方を表示しHide Cats、猫のみを非表示にします。猫だけを表示することはできません -- ペットはそれを上書きします。

注: わかりやすくするために、これを短くしています。.cssRules property実際には、IE のすべてのバージョンが をサポートしているわけではないため、さらに数行追加する必要があります.rules。

于 2012-09-13T17:17:08.167 に答える
-2

この関数を使用すると、任意の数のテーブルを表示できます。

function show_table(){
    for(var i = 1; i  < 7; i++) // change 7 to the amount of tables 
        if(document.getElementById('table'+i))
            document.getElementById('table'+i).style.display='none';

    for (var i = 0; i < arguments.length; i++)
        if(document.getElementById('table'+arguments[i]))
            document.getElementById('table'+arguments[i]).style.display='block';
}

次の ID を持つテーブルを表示するにtable3はtable5:

show_table(3,5);
于 2012-09-17T15:28:33.267 に答える