-1

テーブル内の特定の行を強調表示する関数を作成する（または以下のコードを構築する）必要があります。テーブルヘッダーを常に無視する必要があるため、テーブルヘッダーの後に行数0を開始します。

<style type="text/css">
#myTbl {
     border: 1px solid black
}
#myTbl td, th {
     border: 1px solid black
}

#myTbl tr.normal td {
    color: black;
    background-color: white;
}
#myTbl tr.highlighted td {
    color: white;
    background-color: gray;
}
</style>

  <table id="myTbl">
     <thead>
      <tr>
        <th>ID</th>
        <th>CreatedDate</th>
        <th>Name</th>
        <th>Colour</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>DFRF</td>
        <td>05/03/2010</td>
        <td>Lamp</td>
        <td>Blue</td>
      </tr>
Ect...  
    </tbody>
  </table>

<script type="text/javascript">
var table = document.getElementById("myTbl");
var thead = table.getElementsByTagName("thead")[0];
var tbody = table.getElementsByTagName("tbody")[0];

tbody.onclick = function (e) {
   e = e || window.event;
   var td = e.target || e.srcElement; 
//so must be no other elements inside the td
   var row = td.parentNode;
    alert('Row is ' + (row.rowIndex - 1))
   if (this.lst&&this.lst!=row){
    this.lst.className='';
   }
   row.className = row.className==="highlighted" ? "" : "highlighted";
   this.lst=row;
}

thead.onclick = function (e) {
   e = e || window.event;
   var th = e.target || e.srcElement;  
//so must be no other elements in the th
   alert(th.innerHTML);
}
</script>

何かのようなもの

function goToRow('2')

行2を選択します。

助けが必要です

4

1 に答える 1

1

各TRのIDとしてカウントを追加できます。下記参照：

  <table id="myTbl">
     <thead>
      <tr id="tr0">
        <th>ID</th>
        <th>CreatedDate</th>
        <th>Name</th>
        <th>Colour</th>
      </tr>
    </thead>
    <tbody>
      <tr id="tr1">
        <td>DFRF</td>
        <td>05/03/2010</td>
        <td>Lamp</td>
        <td>Blue</td>
      </tr>

次に、次のJavaScriptを使用します。

function goToRow(where)
{
 document.getElementById("tr"+where+"").style.color="white";
 document.getElementById("tr"+where+"").style.backgroundColor="gray";
}

お役に立てば幸い

于 2013-03-05T15:08:01.153 に答える