Example analysis of jquery using on to bind mouseleave event and mouseenter event to implement mouse hover event

//HTML脚本

<spandata-helperinfo="PortfolioTeam"class="icon help"></span>

//JS脚本

$(document).on({

mouseenter:function () {

var HelpMsgCode = $(this).attr("data-helperinfo");//Gets the current object property values

$.ajax({

type:"GET",

url:"/Portfolio/GetHelpMessageByCode",

//url: "/Subscription/GetHelpMessageByCode",

data: { Code: HelpMsgCode },

dataType:"json",

success:function (item) {

var varJson = $.parseJSON(item.data); //string Turn json

var varContent = varJson.Root.HelpMessage.Content; //Gets the specified JSON node contents

var varMsgHtml = "<span class=&#39;bubble&#39;>" + varContent + "</span>";//Structural HTML

$(".icon.help").append(varMsgHtml);//Additional HTML to a specified location

}

});

},

mouseleave:function () { //When the mouse leaves, a prompt box disappears

$(".icon.help").html("");//Emptying the balloon

}

},".icon.help");



The above is the detailed content of Example analysis of jquery using on to bind mouseleave event and mouseenter event to implement mouse hover event. For more information, please follow other related articles on the PHP Chinese website!