突出显示某些行并创建它们链接

时间:2014-05-06 05:52:19

标签: javascript jquery css html-table

我有这张桌子。我想突出显示一些已经开始状态的点并在用户点击这些时创建链接,如行值发送到文本框并使用Javascript和jQuery删除上面的所有行

<table border="1px" style="font-size: 16px; height: 700px; overflow: auto;" id="myTable">
    <thead>
        <tr>
            <th>Enable</th>
            <th>S No</th>
            <th>Stop Name</th>
            <th>Longitude</th>
            <th>Latitude</th>
            <th>ETA</th>
            <th>Status</th>
            <th>Action</th>
        </tr>
    </thead>
    <tbody>


    <tr>
        <td><input type="checkbox" /></td>
        <td>1</td>
        <td>MaxFort School, Parwana Road</td>
        <td>28.69180</td>
        <td>77.10969</td>
        <td>09:33:45</td>
        <td>Ignition_On</td>
        <td><input type='button' value='Edit'   /> <input type='button' value='Delete' onclick='deleteRow(this.parentNode.parentNode.rowIndex)'/></td>
    </tr>


    <tr>
        <td><input type="checkbox" /></td>
        <td>2</td>
        <td>MaxFort School, Parwana Road</td>
        <td>28.69182</td>
        <td>77.10970</td>
        <td>09:33:52</td>
        <td>Location</td>
        <td><input type='button' value='Edit'   /> <input type='button' value='Delete' onclick='deleteRow(this.parentNode.parentNode.rowIndex)'/></td>
    </tr>


    <tr>
        <td><input type="checkbox" /></td>
        <td>3</td>
        <td>MaxFort School, Parwana Road</td>
        <td>28.69179</td>
        <td>77.10968</td>
        <td>09:34:19</td>
        <td>Ignition_On</td>
        <td><input type='button' value='Edit'   /> <input type='button' value='Delete' onclick='deleteRow(this.parentNode.parentNode.rowIndex)'/></td>
    </tr>


    <tr>
        <td><input type="checkbox" /></td>
        <td>4</td>
        <td>MaxFort School, Parwana Road</td>
        <td>28.69178</td>
        <td>77.10968</td>
        <td>09:34:29</td>
        <td>Start</td>
        <td><input type='button' value='Edit'   /> <input type='button' value='Delete' onclick='deleteRow(this.parentNode.parentNode.rowIndex)'/></td>
    </tr>


    <tr>
        <td><input type="checkbox" /></td>
        <td>5</td>
        <td>MaxFort School, Parwana Road</td>
        <td>28.69176</td>
        <td>77.10969</td>
        <td>09:34:39</td>
        <td>Stop</td>
        <td><input type='button' value='Edit'   /> <input type='button' value='Delete' onclick='deleteRow(this.parentNode.parentNode.rowIndex)'/></td>
    </tr>


    <tr>
        <td><input type="checkbox" /></td>
        <td>6</td>
        <td>MaxFort School, Parwana Road</td>
        <td>28.69175</td>
        <td>77.10970</td>
        <td>09:34:49</td>
        <td>Ignition_On</td>
        <td><input type='button' value='Edit'   /> <input type='button' value='Delete' onclick='deleteRow(this.parentNode.parentNode.rowIndex)'/></td>
    </tr>


    <tr>
        <td><input type="checkbox" /></td>
        <td>7</td>
        <td>MaxFort School, Parwana Road</td>
        <td>28.69178</td>
        <td>77.10971</td>
        <td>09:34:59</td>
        <td>Ignition_On</td>
        <td><input type='button' value='Edit'   /> <input type='button' value='Delete' onclick='deleteRow(this.parentNode.parentNode.rowIndex)'/></td>
    </tr>


    <tr>
        <td><input type="checkbox" /></td>
        <td>8</td>
        <td>MaxFort School, Parwana Road</td>
        <td>28.69177</td>
        <td>77.10970</td>
        <td>09:35:09</td>
        <td>Ignition_On</td>
        <td><input type='button' value='Edit'   /> <input type='button' value='Delete' onclick='deleteRow(this.parentNode.parentNode.rowIndex)'/></td>
    </tr>


    <tr>
        <td><input type="checkbox" /></td>
        <td>9</td>
        <td>MaxFort School, Parwana Road</td>
        <td>28.69179</td>
        <td>77.10970</td>
        <td>09:35:19</td>
        <td>Ignition_On</td>
        <td><input type='button' value='Edit'   /> <input type='button' value='Delete' onclick='deleteRow(this.parentNode.parentNode.rowIndex)'/></td>
    </tr>


    <tr>
        <td><input type="checkbox" /></td>
        <td>10</td>
        <td>MaxFort School, Parwana Road</td>
        <td>28.69180</td>
        <td>77.10970</td>
        <td>09:35:29</td>
        <td>Ignition_On</td>
        <td><input type='button' value='Edit'   /> <input type='button' value='Delete' onclick='deleteRow(this.parentNode.parentNode.rowIndex)'/></td>
    </tr>


    <tr>
        <td><input type="checkbox" /></td>
        <td>11</td>
        <td>MaxFort School, Parwana Road</td>
        <td>28.69181</td>
        <td>77.10971</td>
        <td>09:35:38</td>
        <td>Ignition_On</td>
        <td><input type='button' value='Edit'   /> <input type='button' value='Delete' onclick='deleteRow(this.parentNode.parentNode.rowIndex)'/></td>
    </tr>


    <tr>
        <td><input type="checkbox" /></td>
        <td>12</td>
        <td>MaxFort School, Parwana Road</td>
        <td>28.69180</td>
        <td>77.10972</td>
        <td>09:35:48</td>
        <td>Start</td>
        <td><input type='button' value='Edit'   /> <input type='button' value='Delete' onclick='deleteRow(this.parentNode.parentNode.rowIndex)'/></td>
    </tr>


    <tr>
        <td><input type="checkbox" /></td>
        <td>13</td>
        <td>MaxFort School, Parwana Road</td>
        <td>28.69177</td>
        <td>77.10973</td>
        <td>09:35:58</td>
        <td>Stop</td>
        <td><input type='button' value='Edit'   /> <input type='button' value='Delete' onclick='deleteRow(this.parentNode.parentNode.rowIndex)'/></td>
    </tr>


    <tr>
        <td><input type="checkbox" /></td>
        <td>14</td>
        <td>MaxFort School, Parwana Road</td>
        <td>28.69176</td>
        <td>77.10974</td>
        <td>09:36:08</td>
        <td>Ignition_On</td>
        <td><input type='button' value='Edit'   /> <input type='button' value='Delete' onclick='deleteRow(this.parentNode.parentNode.rowIndex)'/></td>
    </tr>


    <tr>
        <td><input type="checkbox" /></td>
        <td>15</td>
        <td>MaxFort School, Parwana Road</td>
        <td>28.69178</td>
        <td>77.10976</td>
        <td>09:36:18</td>
        <td>Start</td>
        <td><input type='button' value='Edit'   /> <input type='button' value='Delete' onclick='deleteRow(this.parentNode.parentNode.rowIndex)'/></td>
    </tr>


    <tr>
        <td><input type="checkbox" /></td>
        <td>16</td>
        <td>MaxFort School, Parwana Road</td>
        <td>28.69181</td>
        <td>77.10979</td>
        <td>09:36:28</td>
        <td>Ignition_On</td>
        <td><input type='button' value='Edit'   /> <input type='button' value='Delete' onclick='deleteRow(this.parentNode.parentNode.rowIndex)'/></td>
    </tr>


    <tr>
        <td><input type="checkbox" /></td>
        <td>17</td>
        <td>MaxFort School, Parwana Road</td>
        <td>28.69183</td>
        <td>77.10992</td>
        <td>09:36:38</td>
        <td>Moving</td>
        <td><input type='button' value='Edit'   /> <input type='button' value='Delete' onclick='deleteRow(this.parentNode.parentNode.rowIndex)'/></td>
    </tr>


    <tr>
        <td><input type="checkbox" /></td>
        <td>18</td>
        <td>MaxFort School, Parwana Road</td>
        <td>28.69178</td>
        <td>77.11033</td>
        <td>09:36:48</td>
        <td>Moving</td>
        <td><input type='button' value='Edit'   /> <input type='button' value='Delete' onclick='deleteRow(this.parentNode.parentNode.rowIndex)'/></td>
    </tr>


    <tr>
        <td><input type="checkbox" /></td>
        <td>19</td>
        <td>MaxFort School, Parwana Road</td>
        <td>28.69178</td>
        <td>77.11100</td>
        <td>09:36:58</td>
        <td>Moving</td>
        <td><input type='button' value='Edit'   /> <input type='button' value='Delete' onclick='deleteRow(this.parentNode.parentNode.rowIndex)'/></td>
    </tr>


    <tr>
        <td><input type="checkbox" /></td>
        <td>20</td>
        <td>MaxFort School, Parwana Road</td>
        <td>28.69177</td>
        <td>77.11173</td>
        <td>09:37:06</td>
        <td>Depart</td>
        <td><input type='button' value='Edit'   /> <input type='button' value='Delete' onclick='deleteRow(this.parentNode.parentNode.rowIndex)'/></td>
    </tr>

0 个答案:

没有答案