1

HTML ドキュメントに 30 個のリンクがあり、クリックすると特定の div がトリガーされ、js 関数を使用して ID が変更されます。

30 個のリンクのうちの 3 つを次に示します。その後に id が変化する単一の div が続きます。

<a href="#" onclick="changediv_1()">Link 1</a>
<a href="#" onclick="changediv_2()">Link 2</a>
<a href="#" onclick="changediv_3()">Link 3</a>

<div id="contain"></div>

これが div id change 関数です (機能していますが、私の好みではありません):

    function changediv_1()
    {   
        if (document.getElementById("contain")) {  
            document.getElementById("contain").setAttribute("id", "contain_1");
        }

    }

ここに問題があります: リンク 1 をクリックすると、div id が「contain」から「contain_1」に変更されますが、問題はありません。現在、div 名は「contain_1」であるため、リンク 1 をクリックした後にリンク 2 をクリックしようとしても機能しません。これは、div id が「contain_1」になり、各関数が 1 つの id しか呼び出すことができないためです。

複数の div (つまり、#contain、#contain_1、#contain_2) をチェックするには、上記の関数が必要です。

理想的にはこのように:

    function changediv_2()
    {   
        if (document.getElementById("**contain, contain_1, contain_2, ...**")) {  
            document.getElementById("**contain, contain_1, contain_2, ...**").setAttribute("id", "contain_x");
        }

    }

.getElementByClass を調査して適用しようとしましたが、機能しませんでした。関数は ID でのみ機能するようです。それぞれの状況をサポートするために、関数を 900 回 (誇張ではなく) 投稿する方法が必要です。辛抱強く、私のおかしな記事の小説を読んでくれてありがとう。

4

1 に答える 1

0

これを試して、データを使用し、インライン JavaScript 関数 HTMLの代わりに on.click を使用してください

<a href="#" data-contain="1">Link 1</a>
<a href="#" data-contain="2">Link 2</a>
<a href="#" data-contain="3">Link 3</a>

<div id="contain" class="containDiv"></div>

jQuery

$(function () {
    $('a').on('click', function () {
        var contain = "contain_" + $(this).data('contain');
        $('.containDiv').attr('id', contain);
        //contain == contain_(1,2,3)
        /*
         Rest of your code to read from php and put into contain?
      */
    });
});
于 2013-10-16T00:20:30.247 に答える