Events javascript [closed]

-4

Good morning,

This is a row of my table, each of them has an onclick event. Pressing on the select calls that event something that it should not do. How can I do so that if you press on the select, open the select and if you press outside the select the event acts

Thanks

    
asked by tripossi 17.01.2018 в 16:15
source

1 answer

3

The click event is generated in the element that is clicked with the mouse and propagates upwards, generating all the superior elements in the DOM tree.

To avoid this, capture the event in the select element and use the stopPropagation method to stop the propagation of the event:

$(function(){
  $('tr').click(() => console.log('click fila'));
  
  $('#mySelect').click((e) => e.stopPropagation());
});
table tr td{
  padding: 10px;
  border: solid 1px #666666;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr id="fila">
    <td>&nbsp;</td>
    <td>
      <select id="mySelect">
        <option value="1">Opción 1</option>
        <option value="2">Opción 2</option>
        <option value="3">Opción 3</option>
        <option value="4">Opción 4</option>
        <option value="5">Opción 5</option>
      </select>
    </td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>
    
answered by 17.01.2018 / 16:26
source