Question

我在为dijit菜单项调用onClick函数时遇到问题。我一直认为函数是未定义的：

以下是菜单项的代码：

...
<div data-dojo-type="dijit/DropDownMenu" id="fileMenu">
            <div data-dojo-type="dijit/MenuItem" data-dojo-props="onClick:function(){SetPage('test');}">Watershed</div>
        </div>

这是我试图调用的函数：

function SetPage(pg){
alert(pg);
}

我是否必须在代码中注册onclick事件？

由于

Answer 1

这是问题因为setpage的范围不在菜单的onclick功能范围内你可以直接调用这里面的警报功能如下：

<div data-dojo-type="dijit/DropDownMenu" id="fileMenu"> <div data-dojo-type="dijit/MenuItem" data-dojo-props="onClick:function(){alert('test';}">Watershed</div> </div>

或者您可以在此处附加事件处理程序：

<div data-dojo-type="dijit/DropDownMenu" id="fileMenu"> <div data-dojo-type="dijit/MenuItem" data-dojo-props="onClick:_onClick">Watershed</div> </div>

并在您的javascript文件中

_onClick:function(evt){this.SetPage(evt);}, SetPage:function(evt){ alert(evt.target.innerHTML);}

Answer 2

这听起来像一个范围问题。即使命名了一个函数，它也应该在全局范围内可用，以便能够使用声明性代码。

例如，如果您将该函数放在require()块中，它将无法工作，因为它仅限于该函数（它只能从内部显示）。

例如：

require(["dijit/MenuItem", "dijit/DropDownMenu", "dojo/parser"], function() {
  function SetPage(pg) {
    alert(pg);
  };

  SetPage("test"); // This will work because it's in the same scope
});

SetPage("test"); // This will not work

较低的SetPage()调用具有另一个范围，因此无法查看该函数。要解决此问题，必须在全局范围（对于Web应用程序window）上定义该函数。

可能的解决方案是：

require(["dijit/DropDownMenu", "dijit/MenuItem", "dojo/parser"], function() {
  window.SetPage = function(pg) {
    alert(pg);  
  }; 
});

这将有效，因为您将其添加到window对象。您可以在JSFiddle上看到此示例。

使用命名函数进行dijit菜单项的onclick

2 个答案: