Получение номера строки таблицы, по которой кликнули

@mega_bek · Регистрация: 27.09.2009

Author24 — интернет-сервис помощи студентам

Не подскажете, как можно из процедуры обрабки события onClick получить номер строки таблицы, на которую кликнули?

@Dragon_Oleg · 12.01.2011, 09:49

PHP/HTML

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv='Content-Type' content='text/html; charset=iso-8859-1'>
</head>
 
<body>
 
<table id=id>
<tr><td>dd</td></tr>
<tr><td>ddd</td></tr>
<tr><td>sfsfsasf</td></tr>
</table>
<script>
alert(document.all.id.rows.length)
</script>
 
</body>
</html>

@mega_bek · 12.01.2011, 11:57 **[ТС]**

Так разве так получишь номер текущей строки
так, если не ошибаюсь только общее кол-во строк получить можно
Я вот как выкрутилься:
в каждом стобце в title записал номер строки
в обработчике события onclick вытягиваю window.event.srcElement.title
так вроде работает

@Dragon_Oleg · 12.01.2011, 13:12

Ошибочка вышла

PHP/HTML

<html>
<head>
<title>Untitled</title>
</head>
 
<body>
 
<table width='100%' cellpadding='0' border='1' id='t1' >
<tr onClick='nunu('Первая')'>
<td align='center'>asf</td>
<td  align='center' style='background-color:red '></td></tr>
<tr onClick='nunu('Вторая')'>
<td align='center'>asf</td>
<td align='center' style='background-color:red '></td></tr>
<tr onClick='nunu('Третья')' >
<td align='center'>asf</td>
<td align='center' style='background-color:red'></td></tr></table>
<script>
 
function nunu(aa){
alert(aa)
}
</script>
 
</body>
</html>

@bazile · 12.01.2011, 18:56

Для MSIE получилось сделать, а вот для Mozilla с Operа нет. Если получится и для них сделать, то напишу здесь.

PHP/HTML

<script language='javascript'>
function showRow()
{
    // ищем родительский TR
    var tr = window.event.srcElement.parentElement;
    while ('TR' != tr.tagName) tr = tr.parentElement;
    // подсчитываем номер строки
    for (var row=0; tr!=null; tr=tr.previousSibling, row++);
    alert(row);
    //
    window.event.cancelBubble = true;
}
</script>
...
<table border='1' width='100%'>
<tr>
<td onclick='showRow()'><a href='javascript:void(1)' onclick='showRow()'>row 1, cell 1</a></td>
<td onclick='showRow()'>row 1, cell 2</a></td>
</tr>
<tr>
<td onclick='showRow()'><a href='javascript:void(1)' onclick='showRow()'>row 2, cell 1</a></td>
<td onclick='showRow()'>row 2, cell 2</a></td>
</tr>
<tr>
<td onclick='showRow()'><a href='javascript:void(1)' onclick='showRow()'>row 3, cell 1</a></td>
<td onclick='showRow()'>row 3, cell 2</a></td>
</tr>
</table>

@vers · 12.01.2011, 19:08

А обычный rowIndex не работает разве???

HTML5

<table>
<tr onClick='alert(this.rowIndex)'>
       <td>dfgdfg</td>
       <td>dfgdfg</td>
</tr>
<tr onClick='alert(this.rowIndex)'>
       <td>gdfg</td>
       <td>dfgsdfg</td>
</tr>
<tr onClick='alert(this.rowIndex)'>
       <td>bdbbv</td>
       <td>erer</td>
</tr>
<tr onClick='alert(this.rowIndex)'>
       <td>jjyyu</td>
       <td>muhg</td>
</tr>
<tr onClick='alert(this.rowIndex)'>
       <td>ghjgf</td>
       <td>setrer</td>
</tr>
</table>

@bazile · 13.01.2011, 10:51

Спасибо vers. Я упустил это свойство из вида. Причем что приятно, rowIndex определено в стандарте DOM.

Теперь еще бы понять как заставить работать showRow в Mozilla.

19.01.2011, 16:42

для большей кросбровзерности юзайте вместо tr.parentElement tr.parentNode - если еще ченить надо по данному вопросу - то оставте в этом топике вопрос - напишу как кросбровзерно это решить - а так чето сейчас писать лень

19.01.2011, 16:53

лано, опладисментов не нужно

PHP/HTML

<html>
    <head>
        <script>
            function getParentNode(oThis, sNodeName) {
                while(oThis.nodeName != sNodeName && oThis.nodeName != 'BODY' )  {
                    oThis=oThis.parentNode;
                }
                return oThis.nodeName!='BODY'?oThis:null;
            }   
 
            function showRow(obj) {
                var tr = getParentNode(obj, 'TR');
                if(tr) {
                    alert(tr.rowIndex)
                }
            }
        </script>
    </head>
    <body>
        <table border='1' width='100%'>
            <tr>
                <td onclick = 'showRow(this)'>
                        sldnfl/sdnf/lsdnfv/sdfvns/fv
                </td>
            </tr>
            <tr>
                <td onclick = 'showRow(this)'>
                        sldnfl/sdnf/lsdnfv/sdfvns/fv
                </td>
            </tr>
            <tr>
                <td onclick = 'showRow(this)'>
                        sldnfl/sdnf/lsdnfv/sdfvns/fv
                </td>
            </tr>
        </table>
    </body>
</html>

@mega_bek 0 / 0 / 0 Регистрация: 27.09.2009 Сообщений: 42
		1
	Получение номера строки таблицы, по которой кликнули 12.01.2011, 07:52. Показов 18072. Ответов 8 Метки нет (Все метки) Не подскажете, как можно из процедуры обрабки события onClick получить номер строки таблицы, на которую кликнули? 0

@mega_bek 0 / 0 / 0 Регистрация: 27.09.2009 Сообщений: 42
	12.01.2011, 11:57 [ТС]	3
	Так разве так получишь номер текущей строки так, если не ошибаюсь только общее кол-во строк получить можно Я вот как выкрутилься: в каждом стобце в title записал номер строки в обработчике события onclick вытягиваю window.event.srcElement.title так вроде работает 0

@bazile 85 / 61 / 69 Регистрация: 15.03.2007 Сообщений: 6,906
	13.01.2011, 10:51	7
	Спасибо vers. Я упустил это свойство из вида. Причем что приятно, rowIndex определено в стандарте DOM. Теперь еще бы понять как заставить работать showRow в Mozilla. 0

sashok
	19.01.2011, 16:42	8
	для большей кросбровзерности юзайте вместо tr.parentElement tr.parentNode - если еще ченить надо по данному вопросу - то оставте в этом топике вопрос - напишу как кросбровзерно это решить - а так чето сейчас писать лень

	19.01.2011, 16:53