Javascript单例设计模式和闭包

我正在尝试创建一个处理为事件侦听器提供服务的单例对象：

var ChildParent = (function () {
   var html_element = document.getElementById("quoteNum");
   var row_number = 0;

   return {
       init: function(){
           html_element["parenttype"+row_number].addEventListener("click", ChildParent.fire, false);
       },
       add: function(total) { //Adding a row

       },
       fire: function() {
           alert("it fired!");
       }
   } 
})();

---

但是，当我调用ChildParent.init时，文档元素将不会被分配给html_元素，因此我无法附加侦听器。奇怪的是，row_number变量被初始化为零。是否存在某种我不理解的范围冲突？当我使用opera的dragonfly的“单步执行”功能时，我无法在init函数中创建var赋值。

请确保在执行脚本时页面上有id为quoteNum的元素可用。 可能会发生这样的情况：您在执行脚本时没有等待呈现所有页面元素

var ChildParent = (function () {
   function getElement(){
       return html_element ? html_element : html_element = document.getElementById("quoteNum");
   }

   var html_element;
   var row_number = 0;

   return {
       init: function(){
           getElement()["parenttype"+row_number].addEventListener("click", ChildParent.fire, false);
       },
       add: function(total) { //Adding a row

       },
       fire: function() {
           alert("it fired!");
       }
   } 
})();

你可以考虑处理

更新

以下更改可以帮助您解决在呈现页面之前初始化html_元素的问题

var ChildParent = (function () {
   function getElement(){
       return html_element ? html_element : html_element = document.getElementById("quoteNum");
   }

   var html_element;
   var row_number = 0;

   return {
       init: function(){
           getElement()["parenttype"+row_number].addEventListener("click", ChildParent.fire, false);
       },
       add: function(total) { //Adding a row

       },
       fire: function() {
           alert("it fired!");
       }
   } 
})();

---

确保在执行脚本时，id为quoteNum的元素在页面上可用。 可能会发生这样的情况：您在执行脚本时没有等待呈现所有页面元素

var ChildParent = (function () {
   function getElement(){
       return html_element ? html_element : html_element = document.getElementById("quoteNum");
   }

   var html_element;
   var row_number = 0;

   return {
       init: function(){
           getElement()["parenttype"+row_number].addEventListener("click", ChildParent.fire, false);
       },
       add: function(total) { //Adding a row

       },
       fire: function() {
           alert("it fired!");
       }
   } 
})();

你可以考虑处理

更新

以下更改可以帮助您解决在呈现页面之前初始化html_元素的问题

var ChildParent = (function () {
   function getElement(){
       return html_element ? html_element : html_element = document.getElementById("quoteNum");
   }

   var html_element;
   var row_number = 0;

   return {
       init: function(){
           getElement()["parenttype"+row_number].addEventListener("click", ChildParent.fire, false);
       },
       add: function(total) { //Adding a row

       },
       fire: function() {
           alert("it fired!");
       }
   } 
})();

---

上面的代码是在DOM中存在id为quoteNum的元素之后执行的吗

如果不是，html_元素将为空

---

因此，请确保上述所有代码都位于元素下方文档中的某个位置或窗口中的脚本标记中。onload jQuery的document ready type事件。

上述代码是在DOM中存在id为quoteNum的元素之后执行的吗

如果不是，html_元素将为空

---

因此，请确保上述所有代码都位于脚本标记中，该标记出现在元素下方的文档中的某个位置，或者位于window.onload jQuery的document ready类型事件中。

它是从body.onload函数调用的。我已经使用了dragonfly特性的步骤来确保document元素存在。我采取的步骤如下：我是在负重状态下进入身体的。我将函数调用跟踪到ChildParent.init。我使用javascript控制台验证元素是否已加载。我可以在页面上看到该元素。@zshfalcon init太晚了。当ChildParent的初始化器运行时，您的html_元素变量被赋值。我现在明白了。谢谢你的帮助！它是从body.onload函数调用的。我已经使用了dragonfly特性的步骤来确保document元素存在。我采取的步骤如下：我是在负重状态下进入身体的。我将函数调用跟踪到ChildParent.init。我使用javascript控制台验证元素是否已加载。我可以在页面上看到该元素。@zshfalcon init太晚了。当ChildParent的初始化器运行时，您的html_元素变量被赋值。我现在明白了。谢谢你的帮助！quoteNum是一个元素。parenttype0是中的一个元素，我使用它列出记录quotes和invoices的父/子关系。那么这就是输入的id？html_元素是空的还是返回未定义的html_元素[…]？quoteNum是一个元素。parenttype0是中的一个元素，我使用它列出记录quotes和invoices的父/子关系。那么这就是输入的id？是html_元素为空还是返回的html_元素[…]未定义？我正在使用。docReady函数运行ParentChild.init，因此页面已完全加载。@zshfalcon html_元素是在创建ChildParent时分配的，而不是在调用init时分配的。谢谢，我刚刚解决了这个问题。我正在使用。docReady函数运行ParentChild.init，因此页面已完全加载。@zshfalcon html_元素是在创建ChildParent时分配的，而不是在调用init时分配的。谢谢，我刚刚解决了这个问题。