Функция щелчка на ячейке таблицы

Question

Я хотел бы сделать функцию при щелчке по вкладкам первой ячейки только в каждой строке. Это таблица построена с плагином, и этот метод не работает

$('#ecoTableTotal').find('tr').find('td').eq(0).click(function(){ 
    console.log('click'); 
}) 

Это один работает, но мне нужно это только нажать на первой ячейке. Это возможно?

$('#ecoTableTotal').on('click', 'tr' , function (event) { 
     console.log('click'); 
    }); 

РЕДАКТИРОВАТЬ: Таблица генерируется с использованием Bootstrap таблицы (http://wenzhixin.net.cn/p/bootstrap-table/docs/index.html). This question также примерно такая же проблема с функцией щелчка.

Answer 1

Используйте :first-of-type селектор: http://api.jquery.com/first-of-type-selector/

jsBin demo

Как предложено в другом месте, :first-childне будет работать

• не будет направлена ​​на i элемент (согласно вашему запросу), что на самом деле первые i. i.e: если перед элементом i у вас есть <br> или <b>bold</b>, чем i:first-child является больше не первый ребенок!

---

Кажется из ваших комментариев, что ваш TR создается динамически, так что, как

$('#ecoTableTotal').on("click", "tr td:first-of-type i:first-of-type", function(){ 
    console.log('click'); 
}); 

Более подробная информация о том, как использовать: use .on() with event delegation.

---

Чтобы возобновить, вы можете использовать эти два варианта:

"tr td:first-of-type i:first-of-type" 

или

"tr td:first-child i:first-of-type" 
// TD is always the first inside a valid TABLE TR so only here we can use 
// first-child, but there's no guarantee that a contextual <i> element is not 
// preceded by some other HTML element tag. 

Answer 2

Selector> означает, что вы заинтересованы только в прямом элементе ребенка, он помогает определить deph вашего селектора.

$('#ecoTableTotal').on('click', 'tbody > tr > td:first' , function (event) { 
     console.log('click'); 
}); 

Answer 3

$('#ecoTableTotal').on('click', 'tr td:first-child' , function (event) { 
    console.log('click'); 
}); 

EDIT

$('#ecoTableTotal').on('click', 'tr td:eq(0)' , function (event) { 
    console.log('click'); 
}); 

EDIT

$('#ecoTableTotal').on('click', 'tr td:eq(0) i:eq(0)' , function (event) { 
    console.log('click'); 
});