Как добавить событие click в ячейку таблицы в этом коде?

В этом коде я хочу сделать ячейку таблицы доступной с помощью javascript.Как добавить событие click в ячейку таблицы в этом коде?

Просьба также сообщить мне, как использовать значения i, j с событием click.

<!DOCTYPE html> 
<html> 
<head> 
<style> 
td 
{ 
    height : 30px; 
    width : 30px; 
    cursor: pointer; 
} 
</style> 

<script> 
function clickHere(){ 
var table = document.getElementById("myTable"); 
var row ; 
var cell; 
for(var i=0;i<2;i++){ 
    row = table.insertRow(i); 
    for(var j=0;j<2;j++){ 
    cell = row.insertCell(j); 
    } 
} 
} 
</script> 
</head> 

<body onload="clickHere()"> 
<table id = "myTable" border="1"></table> 
</body> 
</html>

источник

2016-06-02 srikanth_k

Возможный дубликат [Javascript onClick event во всех ячейках] (http://stackoverflow.com/questions/19155189/javascript-onclick-event-in-all-cells) – John

Добавьте этот код:

cell.addEventListener("click",function(){ 
    alert("cell clicked"); 
});

После этого кода:

cell = row.insertCell(j);

Это добавит слушателя событий для каждой ячейки. при нажатии на нее появится предупреждение.

источник

2016-06-02 10:59:49

После того, как ячейка добавлена в DOM, вы можете добавить к ней eventListeners. Так что единственное, что вам нужно сделать, это добавить EventListener :)

// here you add the cell and have a reference to it 
cell = row.insertCell(j); 

// now you can add eventlisteners to it 
cell.addEventListener('click', function(){ 
    console.log('cell clicked'); 
});

О добавляющих слушателей событий: MDN

Демо: https://jsfiddle.net/kt9g8h4w/1/

источник

2016-06-02 11:02:31 Pimmol

Добавить щелчок слушателю первым и написать функцию с то же имя слушателя, которое будет выполнено после нажатия. . Попробуйте код ниже:

<!DOCTYPE html> 
<html> 
<head> 
<style> 

td { 
height : 30px; 
width : 30px; 
cursor: pointer; 
} 


</style> 
<script> 

function clickHere(){ 

var table = document.getElementById("myTable"); 
var row ; 
var cell; 
    for(var i=0;i<2;i++){ 
     row = table.insertRow(i); 
     row.addEventListener('click', clickHandlerRow); 
     for(var j=0;j<2;j++){ 
      cell = row.insertCell(j); 
      cell.addEventListener('click', clickHandlerColumn); 
     } 
    } 
} 

function clickHandlerRow(e) { 
    alert("row clicked"); 
} 

function clickHandlerColumn(e) { 
    alert("column clicked"); 
} 
</script> 
</head> 
<body onload="clickHere()"> 

<table id = "myTable" border="1"></table> 

</body> 
</html>

источник

2016-06-02 11:04:11

var table = document.getElementById("myTable"); 

table.addEventListener("click", function(e) { 
    if (e.target && e.target.nodeName == "TD") { 
    alert('Cell clicked') 
    } 
});

источник

2016-06-02 11:07:37

Это было бы идеально, если бы я начал, но к сожалению, он не работает. Скобки закрыты неправильно. Это нужно убирать. Вторая последняя фигурная скобка должна быть удалена. Спасибо –

Это работает для меня, если «td» имеет верхний регистр «TD». Спасибо –

-1

$ ("#") myInput вал (. $ (Это) .children() эк (0) .text()); - выше код (1) «myInput» - это идентификатор поля ввода, в котором отображается выбранное значение ячейки таблицы. (2) 'eq (0)' ->, которые обозначают, когда значение поля ячейки отображается в поле ввода.

источник

2017-06-02 05:44:05

я не понимаю –

Возможно, вы можете улучшить ясность своего ответа, используя опции markdown formattign. Возьмите [tour], чтобы узнать больше о том, как дела обстоят в StackOverflow. – Yunnosch

Как добавить событие click в ячейку таблицы в этом коде?

ответ

Смежные вопросы