jQuery对话框hoverintent导致闪烁

时间:2018-07-13 12:14:29

标签: jquery-ui

我有一个对话框,当一个元素悬停时会弹出。该实现利用悬浮意图来打开和关闭对话框。使用jqueryui 1.12时,对话框会闪烁并且不会保持打开状态。最近更新了打开对话框方法以利用对象,该方法将在对象旁边显示对话框(这是必需的更改)。

    HOVERLINKDELAY: 100
    $("span.memberNameLink").hoverIntent({ over: claimstatus.memberOver, out: claimstatus.memberOut, interval: c.HOVERLINKDELAY });

    memberOver: function (e) {
let claimid = $(this).attr('data-claimid');
let rowData = $(claimstatus.claimsGrid).getRowData(claimid);
claimstatus.openHoverDialog('Claim\'s Member Info: ' + rowData.MemberName.stripTags('span'), 400, 220, e);
let html = '<dl><dt>System ID:</dt><dd>' + rowData.PatientId + '</dd></dl>';
html += '<dl><dt>External Member ID:</dt><dd>' + rowData.ExtMemberID + '</dd></dl>';
html += '<dl><dt>Patient Account Number:</dt><dd>' + rowData.PatientAcctNumber + '</dd></dl>';
html += '<dl><dt>SSN:</dt><dd>' + rowData.SSNumber + '</dd></dl>';
$('#dialogHoverForm').html(html);
    },


    memberOut: function () {
claimstatus.closeHoverDialog();
    },


    openHoverDialog: function (title, width, height, overEvent) {
$("#dialog-hover").dialog({
    position: { my: "center", at: "center", of: overEvent },
    title: title,
    width: width,
    height: height,
    modal: false,
    draggable: true,
    resizable: true,
    closeOnEscape: false,
    open: function (event, ui) { $(".ui-dialog-titlebar-close", this.parentNode).hide(); }
});
    },

防止对话框“闪烁”的可行方法是什么?

1 个答案:

答案 0 :(得分:0)

我最终添加了一个超时,这似乎可以解决该问题。进行以下更改后,对话框将显示2秒钟,然后关闭。

  setTimeout(function () { claimstatus.closeHoverDialog(); }, 2000);