具有模块模式的对象委托

时间:2019-04-23 15:28:55

标签: javascript

我正在尝试使用模块模式来分离问题,并且一切正常,除了我试图将dom字符串从一个模块(UIController模块)委派给另一个我成功完成的事情一次,但是我不知道发生了什么,知道那没有用

enter image description here

Domstrings对象上方的对象位于UIcontroller模块内部,因此我将其公开,以便其他模块可以使用它

enter image description here

正如您所见,我之前做过,并且如下所示,它运行正常,没有任何问题

enter image description here

但是当我在internalController模块中使用它时,出现此错误

enter image description here

所以这是我在其中使用它的地方:

enter image description here

这是我的代码,在此先感谢您

JS

var internalController = (function(UICtrl) {
    addItem: function(day, from, to, text, goingToCkecked) {
      var newPlan, ID,Dom=UICtrl.getDOMstrings();

      if (day === 'pick the day') {
        document.querySelector(Dom.errorCase).style.visibility = "visible";
        document.querySelector(".optionList").classList.add("error-red");
      } else {
        document.querySelector(".error-case").style.visibility = "hidden";
        document.querySelector(".optionList").classList.remove("error-red");
        console.log("that is me");
      }

      document.querySelector("#optionList").addEventListener("change", function(e) {
          document.querySelector(".error-case").style.visibility = "hidden";
          document.querySelector(".optionList").classList.remove("error-red");
      });
 })(UIController);

var UIController = (function() {
  var DOMstrings = {
    inputDay: ".optionList",
    inputTimeF: ".inputTime",
    inputTimeT: ".inputTime2",
    inputText: ".inputText",
    goingToCkecked: ".checkboxx",
    inputBtn: ".add__btn",
    planContainer: ".container",
    errorCase: ".error-case",
    optionList: ".optionList",
  };

  return {
    getInput: function() {
      return {
        inputDay: document.querySelector(DOMstrings.inputDay).value,
        inputTimeF: document.querySelector(DOMstrings.inputTimeF).value,
        inputTimeT: document.querySelector(DOMstrings.inputTimeT).value,
        inputText: document.querySelector(DOMstrings.inputText).value,
        goingToCkecked: document.querySelector(DOMstrings.goingToCkecked).checked,
      };
    },
    getDOMstrings: function() {
      return DOMstrings;
    },
 } 
    }
  };
})();


var controller = (function(interCtrl, UICtrl) {
  var input, newPlan;

  function setupEventListeners() {
    var DOM = UICtrl.getDOMstrings();

    document.querySelector(DOM.inputBtn).addEventListener("click", ctrlAddPlans);

    document.addEventListener("keypress", function(e) {
      if (e.keyCode === 13) {
        ctrlAddPlans();
      }
    });
}

  return {
    init: function() {
      console.log('the app has started');
      setupEventListeners();
    },
  };
})(internalController, UIController);

controller.init();

// setInterval(function() {
// }, 100);

setTimeout(function() {
    document.querySelector(".plansBackground").classList.add("height");
}, 1000);

0 个答案:

没有答案