0

リンクが任意のセルに追加されたときに行全体をクリック可能にするテーブルがあります。私がやりたいのは、このスクリプトをページ上の複数のテーブルに追加することです。問題は、スクリプトはidでのみ使用でき、クラスcssでは使用できないため、1つのテーブルでのみ機能することです。複数のテーブルIDを追加するにはどうすればよいですか？

      window.onload = function(){
      ConvertRowsToLinks("results-table"); //My table id
      // ConvertRowToLinks("results-table", "results-table2");
      // I would like to add results-table2, results-table3 etc...

  }

  function ConvertRowsToLinks(xTableId){

    var rows = document.getElementById(xTableId).getElementsByTagName("tr");

    for(i=0;i<rows.length;i++){
      var link = rows[i].getElementsByTagName("a")
      if(link.length == 1){
        rows[i].onclick = new Function("document.location.href='" + link[0].href + "'");
        rows[i].onmouseover = new Function("this.className='highlight'");
        rows[i].onmouseout = new Function("this.className=''");
      }
    }


    ConvertSideRowsToLinks("sidebar-table");
  }

  function ConvertSideRowsToLinks(xTableId){

    var rows = document.getElementById(xTableId).getElementsByTagName("tr");

    for(i=0;i<rows.length;i++){
      var link = rows[i].getElementsByTagName("a")
      if(link.length == 1){
        rows[i].onclick = new Function("document.location.href='" + link[0].href + "'");
        rows[i].onmouseover = new Function("this.className='highlight'");
        rows[i].onmouseout = new Function("this.className=''");
      }
    }

  }
4

3 に答える 3

0

クラスを次のように使用します：

//Html code
<a class="test" name="Name 1"></a>
<a class="test" name="Name 2"></a>
<a class="test" name="Name 3"></a>

// access like
var elements = document.getElementsByClassName("test");
于 2012-09-12T15:35:04.263 に答える
0

配列を渡して、それを反復処理することができます。

function ConvertTablesRowsToLinks(tableIds){
  tableIds.forEach( ConvertRowsToLinks);

}

function ConvertRowsToLinks(xTableId){
    var i; // variable i should be declared otherwise is leaking to global namespace.
    var rows = document.getElementById(xTableId).getElementsByTagName("tr");
    for(i=0;i<rows.length;i++){
      var link = rows[i].getElementsByTagName("a")
      if(link.length == 1){
      rows[i].onclick = new Function("document.location.href='" + link[0].href + "'");
      rows[i].onmouseover = new Function("this.className='highlight'");
      rows[i].onmouseout = new Function("this.className=''");
    }
  }
于 2012-09-12T15:37:12.323 に答える
0

この方法で引数をスライスすることもでき、必要な数のIDを渡すことができ、明示的に配列を作成する必要はありません。

  function ConvertSideRowsToLinks()
  {
    var ids = Array.prototype.slice.call(arguments)
    for (var key in ids)
    {
        var table =  document.getElementById(ids[key])
        var rows =table.getElementsByTagName("tr");

        for(i=0;i<rows.length;i++){
          var link = rows[i].getElementsByTagName("a")
          if(link.length == 1){
            rows[i].onclick = new Function("document.location.href='" + link[0].href + "'");
            rows[i].onmouseover = new Function("this.className='highlight'");
            rows[i].onmouseout = new Function("this.className=''");
        }
      }
    }
  }
于 2012-09-12T15:40:57.790 に答える