Why is JS triggered only by double clicking?

Task: determine the table cell by rows and cells.

Table:

<table id="my_table"> <tbody> <tr> <td>1000</td> <td>3000</td> <td>5000</td> </tr> <tr> <td onclick="myFunction(this)">300</td> <td onclick="myFunction(this)">400</td> <td onclick="myFunction(this)">500</td> </tr> <tr> <td onclick="myFunction(this)">2</td> <td onclick="myFunction(this)">3</td> <td onclick="myFunction(this)">500</td> </tr> </tbody> </table>

Js

  if (!document.getElementsByTagName || !document.createTextNode) return; var temp; var rows = document.getElementById('my_table').getElementsByTagName('tbody')[0].getElementsByTagName('tr'); for (i = 0; i < rows.length; i++) { rows[i].onclick = function() { str1=this.rowIndex + 1; } }

    1 answer 1

    task: to determine the table cell by rows and cells.

    If this implies some kind of getting the "coordinates" of the cell you clicked on, you can do this :

     var trIndx = [].slice.call(document.querySelectorAll('#my_table tr')), td = document.querySelectorAll('#my_table td'), out = document.querySelector('output'); [].forEach.call(td, function(el){ el.addEventListener('click', function(){ var tr = this.parentNode, x = trIndx.indexOf(tr), tds = [].slice.call(tr.children), y = tds.indexOf(this); out.innerHTML = 'X: ' + (x + 1) + ', Y:' + (y + 1); }, false); });