我有两个按钮,想根据按下的按钮将不同的自定义模板小部件加载到 div 中。第一次点击它工作正常,但是当再次点击其中一个按钮时出现主题错误。我有这个非常简化的例子来尝试让这个概念发挥作用
我的模板代码(有两个和这个很像):
define([
"dojo/_base/declare",
"dijit/_WidgetBase",
"dijit/_TemplatedMixin",
"dojo/text!Templates/Person.htm"
], function (declare, _WidgetBase, _TemplatedMixin, personTpl) {
return declare([_WidgetBase, _TemplatedMixin], {
templateString: personTpl
});
});
我的模板(有两个和这个很相似):
<div>
<p>Bob Jones</p>
</div>
主页:
<body class="claro">
<script>
require([
"dijit/form/Button",
"Templates/Person", "Templates/Person2", "dojo/domReady!"
], function (Button, Person, Person2) {
var Button1 = new Button({
label: "Person1",
onClick: function () {
var p = new Person({}, "page");//error occurs here after a button has been pressed once
}
}, "btnPerson1").startup();
var Button2 = new Button({
label: "Person2",
onClick: function () {
var p2 = new Person2({}, "page"); //error occurs here after a button has been pressed once
}
}, "btnPerson2").startup();
});
</script>
<button id="btnPerson1" type="button"></button>
<button id="btnPerson2" type="button"></button>
<div id="page"></div>
</body>
感谢任何想法
最佳答案
嘿,我拿了你的代码并创建了一个 jsfiddle 测试,现在我意识到你的问题是什么。
如果我理解正确的话,您在创建第二个对象和其他对象时遇到了麻烦。对于第一个小部件,我相信你没问题。
所以,第一个对象没问题的原因是 dojo 使用您的 ID 创建了小部件,并且他们有一个名为 widgetid 的东西。 widgetid 被放在一个列表中,如果您调用小部件的 destroy 方法,它就会从列表中删除;但是,当您调用小部件的 destroy 方法时,它会销毁该节点。这是解决您问题的 jsfiddle 链接,如果我理解正确,请告诉我。
http://jsfiddle.net/cyeddpe5/26/
define("Person",[
"dojo/_base/declare",
"dijit/_WidgetBase",
"dijit/_TemplatedMixin",
], function (declare, _WidgetBase, _TemplatedMixin, personTpl) {
return declare([_WidgetBase, _TemplatedMixin], {
templateString: "<div><p>Bob Jones</p></div>"
});
});
require([
"dijit/form/Button",
"Person", "dojo/domReady!"
], function (Button, Person) {
var Button1 = new Button({
label: "Person1",
onClick: function () {
//Here is the trick
if(window.p)
{
window.p.destroy(false);
var page = document.createElement("div");
dojo.body().appendChild(page);
page.setAttribute("id","page");
}
window.p = new Person({}, "page");//error occurs here after a button has been pressed once
}
}, "btnPerson1").startup();
});
我不喜欢在 div 中使用 id 来创建我的小部件,我通常使用对小部件的引用来代替它,但这取决于您。请记住销毁小部件并重新创建节点。我很确定有一种方法可以销毁使节点保持事件状态的小部件,但我没有时间找到它。对不起。
关于javascript - 尝试使用 id 注册小部件,但该 id 已经注册,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25797195/