如何防止在工具提示对话框中选择's选择选项操作触发mouseleave事件

How to prevent select in tooltipdialog's select option operation trigger onmouseleave event

本文关键字：选择 选项 操作 事件 mouseleave 何防止 工具提示 对话框      更新时间：2023-09-26

在ToolTipDialog中使用dijit/form/Select。设置对话框的mouseleaveevent。但当我尝试选择一个选项时，该事件将被触发。

Fiddle链接：选择更改将在离开时触发工具提示对话框

<script>
    require([
        "dojo/parser",
        "dijit/registry",
         "dijit/TooltipDialog",
        "dijit/form/Select",
        "dijit/popup",
        "dojo/on",
        "dojo/dom",
         "dojo/domReady!"
    ], function(parser,registry,TooltipDialog,Select, popup, on, dom){
        parser.parse();
        var selHucode="";
        var myTooltipDialog = new TooltipDialog({
            id: 'myTooltipDialog',
            style:'height:180px',
            style: "width: 300px;",
            content:  '<div id="tpDialog" class="pDlg"></div><div id="btnGroup" class="left"><label for="name">selectP:</label> <input data-dojo-type="dijit/form/RadioButton">' +
        '<br><label for="hobby"> 1111:</label> <input data-dojo-type="dijit/form/RadioButton"></div>'
        +'<div id="selectMenu" class="right"> <select name="select1" id="sel"   data-dojo-type="dijit/form/Select"> <option value="TN">Tennessee</option>'+
        '<option value="VA" selected="selected">Virginia</option></select></div>' ,
            onMouseLeave: function(e){
                 popup.close(myTooltipDialog);
            },
        onOpen:function(e){
            var sHu=registry.byId("sel");
           sHu.on("focus",function(e){
               console.log(e);
           })
            selHucode=sHu.value;
   //      console.log(sHu.value);
        }
        });

        on(dom.byId("ttt"),"mouseover" , function(e){
            popup.open({
                popup: myTooltipDialog,
                orient: ["above-centered","above","below"],
                around:dom.byId('ttt')
            });
        });

    });
</script>


<span id="ttt"  >  tttt</span>

非常简单：在TooltipDialog onMouseLeave事件中，检查鼠标是否使用registry getEnclosingWidget方法悬停选择，如果它对应于您的选择名称('select1')，则阻止关闭。

这是您要更改的代码：

onMouseLeave: function(e){
   if(registry.getEnclosingWidget(e.target).name=="select1") return;
   popup.close(myTooltipDialog);
}

如果你想检查的话，这里有一把小提琴：fiddle

相关文章：