2014-07-18 42 views
0

打开一个弹出或提示的onclick链接的我到处以下教程各地的网络要弄清楚这是我新的道场,我知道的jQuery但道场,没办法在道场

我下面从计算器链接本身,而是无法tofigure出代码:

http://stackoverflow.com/questions/18476084/dojo-and-javascript-lightweight-tooltip-in-onclick-on-anchor-tab 

我试着拧了一些代码,但它是说作为

的ShowDialog是不确定的..

而且,什么是要求是:

  1. 点击链接,只是链接后,打开的对话框或提示,在它附近positionsing。

  2. 具有弹出或关闭它提示里面的链接,所以它实际上应该关闭toltip或弹出,

这里是我的尝试到现在:

<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.6/dojo/dojo.js"></script> 
<script> 
dojo.require("dijit.Dialog"); 
     dojo.addOnLoad(showDialog); 
     elliotDialog = new dijit.Dialog({ 
      title: "My Dialog", 
      content: "test content", 
      style: "width: 450px" 
     }); 
     showDialog = function(){ 
      // set the content of the dialog: 
      elliotDialog.set("title"); 
      elliotDialog.set("content"); 
      elliotDialog.show(); 
     }; 
</script> 

<a href="javascript:void(0);" onclick="showDialog();" class="moreLink">More pricing...</a></p> 
     <div dojoType="dijit.Dialog" id="elliotDialog" title="More Pricing Option"> 

     </div> 

回答

1

有代码中出现几处错误:

您声明了声明式风格的窗口小部件和以相同名称编程创建的窗口小部件。删除你的代码的以下部分:

<div dojoType="dijit.Dialog" id="elliotDialog" title="More Pricing Option"> 

</div> 

您使用dojo.addOnLoad()错误。当你想等待模块和DOM加载时,应该调用dojo.addOnLoad()函数。没有理由在这里调用showDialog()函数。
更糟糕的是,在您调用它的那一刻,showDialog()函数甚至不存在,因为您稍后在代码中声明它。这就是为什么你得到了错误的原因:

Uncaught ReferenceError: showDialog is not defined 

希望发生的事情是,你换你的对话框创建代码,一切都依赖于它,在dojo.addOnLoad()函数内部,例如:

dojo.addOnLoad(function() { 
    elliotDialog = new dijit.Dialog({ 
     title: "My Dialog", 
     content: "test content", 
     style: "width: 450px" 
    }); 
    showDialog = function(){ 
     // set the content of the dialog: 
     console.log(elliotDialog); 
     elliotDialog.set("title"); 
     elliotDialog.set("content"); 
     elliotDialog.show(); 
    }; 
}); 

您正在错误地使用对话框的设置者。当使用dijit/Dialog::set()函数时,您应该提供两个参数,一个用于定义要设置的属性,另一个用于您想要使用的值,因此在这种情况下需要显示标题和内容。

例如:

elliotDialog.set("title", "My title"); 
elliotDialog.set("content", "My content"); 

如果你做过的一切,你的代码应该工作得很好,因为你可以在下面看到小提琴:http://jsfiddle.net/4jnHk/