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

@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>

Новые блоги и статьи
Telegram бот на C# InfoMaster 08.01.2025 Разработка ботов для Telegram стала неотъемлемой частью современной экосистемы мессенджеров. C# предоставляет мощный и удобный инструментарий для создания разнообразных ботов, от простых. . .	Использование GraphQL в Go (Golang) InfoMaster 08.01.2025 Go (Golang) является одним из наиболее популярных языков программирования, используемых для создания высокопроизводительных серверных приложений. Его архитектурные особенности и встроенные. . .	Что лучше использовать при создании класса в Java: сеттеры или конструктор? Alexander-7 08.01.2025 Вопрос подробнее: На вопрос: «Когда одновременно создаются конструктор и сеттеры в классе – это нормально?» куратор уточнил: «Ваш класс может вообще не иметь сеттеров, а только конструктор и геттеры. . .	Как работать с GraphQL на TypeScript InfoMaster 08.01.2025 Введение в GraphQL и TypeScript В современной разработке веб-приложений GraphQL стал мощным инструментом для создания гибких и эффективных API. В сочетании с TypeScript, эта технология. . .	Счётчик на базе сумматоров + регистров и генератора сигналов согласования. Hrethgir 07.01.2025 Создан с целью проверки скорости асинхронной логики: ранее описанного сумматора и предополагаемых fast регистров. Регистры созданы на базе ранее описанного, предполагаемого fast триггера. То-есть. . .	Как перейти с Options API на Composition API в Vue.js BasicMan 06.01.2025 Почему переход на Composition API актуален В мире современной веб-разработки фреймворк Vue. js продолжает эволюционировать, предлагая разработчикам все более совершенные инструменты для создания. . .
Архитектура современных процессоров inter-admin 06.01.2025 Процессор (центральный процессор, ЦП) является основным вычислительным устройством компьютера, которое выполняет обработку данных и управляет работой всех остальных компонентов системы. Архитектура. . .	История создания реляционной модели баз данных, правила Кодда Programming 06.01.2025 Предпосылки создания реляционной модели В конце 1960-х годов компьютерная индустрия столкнулась с серьезными проблемами в области управления данными. Существовавшие на тот момент модели данных -. . .	Полезные поделки на Arduino, которые можно сделать самому raxper 06.01.2025 Arduino как платформа для творчества Arduino представляет собой удивительную платформу для технического творчества, которая открывает безграничные возможности для создания уникальных проектов. Эта. . .	Подборка решений задач на Python IT_Exp 06.01.2025 Целью данной подборки является предоставление возможности ознакомиться с различными задачами и их решениями на Python, что может быть полезно как для начинающих, так и для опытных программистов. . . .	С чего начать программировать микроконтроллеры raxper 06.01.2025 Введение в мир микроконтроллеров Микроконтроллеры стали неотъемлемой частью современного мира, окружая нас повсюду: от простых бытовых приборов до сложных промышленных систем. Эти маленькие. . .	Из чего собрать игровой компьютер inter-admin 06.01.2025 Сборка игрового компьютера требует особого внимания к выбору комплектующих и их совместимости. Правильно собранный игровой ПК не только обеспечивает комфортный геймплей в современных играх, но и. . .

@mega_bek 0 / 0 / 0 Регистрация: 27.09.2009 Сообщений: 42
		1
	Получение номера строки таблицы, по которой кликнули 12.01.2011, 07:52. Показов 18159. Ответов 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