JQuery / Javascript - Как найти индекс заголовка таблицы по тексту заголовка - PullRequest
Новая
       2

JQuery / Javascript - Как найти индекс заголовка таблицы по тексту заголовка

4 голосов
/ 09 марта 2012

Как найти индекс столбца по отображаемому тексту?

, например 

<table>
   <tr>
     <td>ID</td>
     <td>Name</td>
     <td>Age</td>
   </tr>
   <tr>
      ...
   </tr>
</table>

Я бы хотел что-то вроде 

var nameIndex = getColIndex('Name'); // nameIndex = 1

Есть ли быстрый / хороший способ сделать это? (Не обязательно должен быть jQuery, но было бы неплохо)

Ответы [ 3 ]

17 голосов
/ 09 марта 2012

В Chromium 17 / Ubuntu 11.04, похоже, работают следующие оба: 

$('tr td').filter(
    function(){
        return $(this).text() == 'Name';
    }).index();

JS Fiddle demo .

Или: 

$('td:contains("Name")').index();

Демонстрация JS Fiddle .

<ч />

Отредактировано в ответ на вопрос ОП, в комментариях ниже:

но как мне ограничить его первым рядом?

Чтобы ограничить его первой строкой, просто используйте селектор :first: 

$('tr:first td')

Предоставление: 

$('tr:first td').filter(
    function(){
        return $(this).text() == 'Name';
    }).index();

JS Fiddle demo .

Ссылки

2 голосов
/ 09 марта 2012 
//select the first TR element, then select its children (the TDs),
//then filter them down to only the one that contains a certain string
var theIndex = $('tr').first().children().filter(function () {
    return ($(this).text() == 'ID');
}).index();

При передаче .filter() функции, если вы возвращаете true для индекса, он будет сохранен в выделении, а если вы вернете false, то этот индекс будет удален из выделения: http://api.jquery.com/filter

Это ограничит поиск первой строкой и даст индекс столбца с указанным поисковым текстом (используется этот код ID).

Обратите внимание, что .index() при использовании, как указано выше, вернет индекс текущего выбора на основе его родственных элементов: http://api.jquery.com/index

1 голос
/ 09 марта 2012

http://jsfiddle.net/justiceerolin/FdhcV/

$(function(){
    $('#search').click(function(){
        $('td').each(function(index){
            if ($(this).text() == $('#lookup').val()){
                console.log(index)
            }
        });    
    });   
});​
...