javascript - jquery hover not called on elements that get the class after page has loaded -


i have ip validation mvc based website "crude" frontend validation of ipv4 field. if ip get's changed add image , error message field.

however, seems work data comes back-end. fields incorrect data coming backend , loaded before javascript loads. have "hover" event. fields validation-invalid class after loading not have hover event.

how go fixing this? i've tried on mouseenter, mouseleave aswell.

$(".validation-invalid").hover(function () {     $("#" + $(this)[0].id + "-error").toggle(); });  function validateipv4(sender) {     var ip = $(sender).val();     var ipformat = /^(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/;      if (ip.match(ipformat)) {             $(sender).removeclass("validation-invalid").addclass("validation-valid");     } else {         $(sender).addclass("validation-invalid").removeclass("validation-valid");         $('<span class="error-popover" id="' + $(sender)[0].id + '-error"><img class="error-callout" src="/content/images/callout.png" alt="help pointer">@globalizedresources.device_configuration_page_ipv4_error</span>').insertafter(sender);     } } 

so events bound when elements present in dom, attach events dynamically generated elements jquery provides other apis this. old jquery version provides .bind() , new version provides .on() apis.

$(document).on("mouseover", ".validation-invalid", function () {     $("#" + $(this)[0].id + "-error").toggle(); });  //instead of "document" use wrapper/container of ".validation-invalid" 

Comments

Popular posts from this blog

javascript - Using jquery append to add option values into a select element not working -

Android soft keyboard reverts to default keyboard on orientation change -

Rendering JButton to get the JCheckBox behavior in a JTable by using images does not update my table -