The problem is that the function remembers each previous cell and adds the selected one to it, and changes the text in it too. And I need for each cell separately. Tell me what the problem is or correct the code. Thank.

<div id="left"> <table id="tableCinema" style="border-collapse: collapse;" border="1" > <tr> <th >Type</th> <th >Name</th> <th >Time</th> </tr> <tr> <td >1</td><td >*</td><td >*</td> </tr> <tr> <td >2</td><td >*</td><td >*</td> </tr> <tr> <td >3</td><td >*</td><td >*</td> </tr> <tr> <td >4</td><td >*</td><td >*</td> </tr> </table> Change: <input id="changes" type="checkbox" name="" onclick="eventsInTable()"><br> Get text for change: <input id="changeText" type="text" name="" value=""> <button id="applyToChanges">Apply</button> </div> 
 //Выбор ячейки и замена текста var changeText = function(e){ var inputChangeText, applyChanges; inputChangeText = document.getElementById('changeText'); applyChanges = document.getElementById('applyToChanges'); inputChangeText.value = e.target.textContent; //получить текст с ячейки //замена текста applyChanges.addEventListener('click', function(){ e.target.textContent = inputChangeText.value; }, false); } //доступ к изменение текста function eventsInTable(){ var checkBoxChanges = document.getElementById('changes'); var table = document.getElementById('tableCinema'); if (checkBoxChanges.checked) { table.addEventListener('click', changeText, false); } else { table.removeEventListener('click', changeText, false); alert("You haven't access to change"); } }

    1 answer 1

    The problem in multiple execution:

     applyChanges.addEventListener('click', function(){ e.target.textContent = inputChangeText.value; }, false);

    and shooting all accumulated handlers with the corresponding captured е .

    • If I understand you correctly, after executing the handler, should I delete it, or “forget” the captured e ? - Misha Podlevsky
    • @Misha Podlevskih Not really. You should not add a new handler every time changeText is changeText , and e.target should be stored in changeText in an external variable, which you should use in the click handler for applyChanges . - Igor