I have this HTML that has the id that is inserted into the loop repeat ...
%pre%So I have this function:
%pre%In this '.element' I actually wanted to do something like %code% of the element I clicked on, remembering that this function is out of loop repetition ... is there any way to do this?
An alternative way could be:
%pre%Where soon after, in your JavaScript file, your function should be written
%pre%Providing %code% as a parameter allows you to retrieve the properties of the field as: %code%
In cases where you have multiple elements with the same class, but want to get the ID of the element that triggered the event, you should use %code% (pure JavaScript) or %code% (jQuery), in the example below I just changed the 'touchstart' event for the 'click':
To interact with the event-enabled element, you can only
%pre%%code% will always reference the element that triggered the event.
I have this HTML that has the id that is inserted into the loop repeat ...
<div class="item-total elemento" id = ${id}>
So I have this function:
$(document).on('touchstart', '.elemento', function (){
});
In this '.element' I actually wanted to do something like '.elemento > id' of the element I clicked on, remembering that this function is out of loop repetition ... is there any way to do this?
An alternative way could be:
<div class="item-total elemento" id = ${id} onClick="funcao(this)">
Where soon after, in your JavaScript file, your function should be written
function funcao(elemento) {
// TODO
}
Providing this as a parameter allows you to retrieve the properties of the field as: this.value, this.id, etc
In cases where you have multiple elements with the same class, but want to get the ID of the element that triggered the event, you should use this (pure JavaScript) or $(this) (jQuery), in the example below I just changed the 'touchstart' event for the 'click':
$(document).on('click', '.elemento', function (){
console.log(this.id);
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script><divclass="item-total elemento" id ="1">1</div>
<div class="item-total elemento" id ="2">2</div>To interact with the event-enabled element, you can only
$(document).on('touchstart', '.elemento', function (){
// adiciona uma class active apenas no elemento o selecionado
$(this).addClass("active");
});
$(this) will always reference the element that triggered the event.