при нажатии на любую первую ячейку выполняется одна ф-ция, в остальных случаях

375

24 ноября 2016, 09:48

Имеется таблица, при нажатии на любую первую ячейку выполняется метод initExpandableTableRows(), а если нажать на любую другую ячейку, то выполняется метод initTableRows(). Код неверный. Я новичок

function addOnclickToDatatableRows() {
    var tds = $('[id*=dataTable] tr td:first-child').get();
    var trs = $('[id*=dataTable] tbody:first tr').get();
    for (var i = 0; i < tds.length; i++) {
        tds[i].onclick = new Function("selectFirstCell()");
        trs[i].onclick = new Function("selectRow()");
    }

}
function selectFirstCell() {
    initExpandableTableRows();
}
function selectRow(){
    initTableRows();
}

Answer 1

Ваш пример похож на псевдокод, но из него, если я правильно все понял, ответ может быть таким:

$rows = $('table tr'); 
$cols_first = $rows.find('td:first-of-type'); 
$cols_secnd = $rows.find('td:not(:first-of-type)'); 
 
$cols_first.click(function() { 
  alert('cols_first'); 
}); 
 
$cols_secnd.click(function() { 
  alert('cols_secnd'); 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
  <tr> 
    <td>1</td> 
    <td>2</td> 
    <td>3</td> 
  </tr> 
  <tr> 
    <td>1</td> 
    <td>2</td> 
    <td>3</td> 
  </tr> 
  <tr> 
    <td>1</td> 
    <td>2</td> 
    <td>3</td> 
  </tr> 
</table>

Уточните вопрос, если код делает не то, что вы спросили.

Answer 2

Можно еще с проверкой на индекс - .index() :

var  
    table = $('table'), 
    trs = table.find('tr'), 
    tds = trs.find('td'); 
 
 
tds.click(function(){ 
  if($(this).index() === 0){ 
    selectFirstCell(); 
     
  }else if($(this).index() !== 0){ 
    selectRow(); 
  }      
}); 
 
 
function selectFirstCell() { 
//     initExpandableTableRows(); 
  alert('initExpandableTableRows'); 
} 
 
function selectRow(){ 
//     initTableRows(); 
  alert('initTableRows'); 
 
}

td { 
  border: 1px solid #ccc; 
  padding: 1rem 2rem; 
  cursor: pointer; 
}

<script src="https://code.jquery.com/jquery-2.0.3.js"></script> 
   
<table>  
  <tr> 
    <td>1</td><td>1</td><td>1</td> 
  </tr>  
  <tr> 
    <td>2</td><td>2</td><td>2</td> 
  </tr>  
  <tr> 
    <td>3</td><td>3</td><td>3</td> 
  </tr>  
</table>