duplicate events in a temple when doing mousemove on an element

Question

duplicate events in a temple when doing mousemove on an element

Navigation

#1 by (2 votes)

1

I have a case where I have to generate a hover of an element through a template that runs the website the same actions, but the issue is that its duplicates for the same reason what is dynamically called this in JavaScript

Here is the code of the temple to which I do the hover is the one that has the class results-saveItem

<span class="Item-Selection">
 <img src="/website-images/icons/btn{{ON}}-love.svg" id="_Botton-Love" class="results-saveItem {{saved}}" title="Add To Lovelist" data-groupnumber="{{groupnumber}}"> 
</span>

The jQuery code that makes hover is as follows:

$(document).on("mousemove",".results-saveItem",function()
{
 var love_green = "/website-images/icons/love-border-green.svg"; $(".results-saveItem").attr("src",love_green); 
});

jquery html

asked by Jose Cervantes 19.12.2017 в 21:43

source

1 answer

I am Configuration A Search button of my Client Form and I have a Problems with a Variable SQL query followers

score 2 · Answer 1

Instead of applying the modification on all the elements that share the class .results-saveItem , apply it only on the object that triggers the listener:

$(document).on("mousemove",".results-saveItem",function() {
   var love_green = "/website-images/icons/love-border-green.svg"; 
   $(this).attr("src", love_green); 
});

EDIT: If it were for example a <div> and you would like to change the background:

$(document).on("mousemove",".results-saveItem",function() {
   var love_green = "url(/website-images/icons/love-border-green.svg)"; 
   $(this).css("background-image", love_green); 
});