Issue for the "change" event of "select" in ToolTipDialog execution times - events

Question

Why Select change event execution times will increase with the number of button's click.
HTML :
<button id="btn">click me</button>
JS
require(["dojo/_base/declare", "dojo/dom", "dojo/on", "dojo/_base/lang", "dijit/registry", "dijit/TooltipDialog", "dijit/popup","dijit/form/Select", "dojo/_base/array", "dojo/domReady!"],
function(declare, dom, on, lang, registry, TooltipDialog, popup,Select, Array) {
var InfoWindow= declare( // 类名省略
TooltipDialog,
{
constructor: function (parameters) {
console.log("hello");
},
test:function(){
var tNode=dom.byId("btn");
var myTooltipDialog = new TooltipDialog({
id: 'myTooltipDialog',
style: "width: 300px;",
content: '<div id="tpDialog006" class="pDlg"></div><div id="selectMenu" class="right"><select name="select1" id="sel006" data-dojo-type="dijit/form/Select"> <option value="037" selected="selected">1</option><option class="left" value="005" >2</option><option class="left" value="007" >3</option><option value="006">4</option></select></div>',
onMouseLeave: function(e){
if(registry.getEnclosingWidget(e.target).name=="select1")
return;
popup.close(myTooltipDialog);
},
onOpen:lang.hitch(this, function(e) {
})
});
var sHu = registry.byId("sel006" );
sHu.on("change", function (e) {
alert( "value is" +sHu.value);
});
on(tNode,"click",function(){
popup.open({
popup: myTooltipDialog,
around: dom.byId('btn')
});
})
this.m1="t1";
}
}
);
var infoWindow = new InfoWindow({
});
infoWindow.test();
});
The code is at the link:code link
there may be some problem for the tooltipdialog shows but it will not affect the issue to be reproduced.

Answer 1

This is normal that the click is reproduced because :
in the button click (above) :
on(tNode,"click",function(){
popup.open({
popup: myTooltipDialog,
around: dom.byId('btn')
});
})
In every button click you are opening the Popup so, the tooltip's open function is being executed ( onOpen event fired ) which means that the change event is attached again to your sel006 select input .
What I propose to you is not to assign the select change event inside the tooltips onOpen event and just declare it after the toolTip initialization
So the code became :
var myTooltipDialog = new TooltipDialog({
id: 'myTooltipDialog',
style: "width: 300px;",
content: '<div id="tpDialog006" class="pDlg"></div><div id="selectMenu" class="right"><select name="select1" id="sel006" data-dojo-type="dijit/form/Select"> <option value="037" selected="selected">1</option><option class="left" value="005" >2</option><option class="left" value="007" >3</option><option value="006">4</option></select></div>',
onMouseLeave: function(e){
if(registry.getEnclosingWidget(e.target).name=="select1")
return;
popup.close(myTooltipDialog);
},
onOpen:lang.hitch(this, function(e) {
// remove event from here
})
});
var sHu = registry.byId("sel006" );
sHu.on("change", function (e) {
alert( "value is" +sHu.value);
});
Bellow a fiddle example : Fiddle