我收到此错误Uncatch TypeError:this.getElements不是一个函数

I'm getting this error Uncaught TypeError: this.getElements is not a function

本文关键字:函数 一个 getElements this 错误 Uncatch TypeError      更新时间:2023-09-26

我查看了一些答案,但我没有得到任何结果,我正在尝试解决此问题"未捕获的类型错误:this.getElements不是一个函数"。这部分代码,完整代码在链接中。

var SIDEBAR = new function() {
    this.on = function(nameElement){
        this.menu = nameElement;
        return this;
    };
    /*more code*/
    this.getElements = function() {
        /*more code*/
        return [];
    };
     /*more code*/
    this.addElements = function() {
        var elementsData = this.getElements();
         /*more code*/
    };
}();
var sid = SIDEBAR.on('test');
sid.load();

完整代码:https://jsfiddle.net/e6shbnsu/

this的值由函数的调用方式决定。

this将指向setTimeout中的window。使用 .bind 将指定的值作为上下文this

bind() 方法创建一个新函数,该函数在调用时将其 this 关键字设置为提供的值,并在调用新函数时提供的任何参数序列之前具有给定的参数序列。

function inElectron() {
  return navigator.userAgent.indexOf("Electron") != -1;
}
var dataManager = {
  getItem: function(key, local) {
    if (inElectron() || local == 1)
      return localStorage.getItem(key);
    else
      return sessionStorage.getItem(key);
  },
  setItem: function(key, item, local) {
    if (inElectron() || local == 1)
      localStorage.setItem(key, item);
    else
      sessionStorage.setItem(key, item);
  }
};
var SIDEBAR = new function() {
  this.on = function(nameElement) {
    this.menu = nameElement;
    return this;
  };
  this.load = function() {
    this.currentElement = 0;
    this.refreshElements();
  };
  this.setAddElementName = function(name) {
    this.addElementName = name;
  };
  this.setNewElementName = function(name) {
    this.newElementName = name;
  };
  this.getElements = function() {
    var elementsData = dataManager.getItem(this.getDataKey);
    if (typeof elementsData !== 'undefined' && elementsData !== null) {
      return JSON.parse(elementsData);
    }
    return this.getPreloadData();
  };
  this.setDataKey = function(key) {
    this.dataKey = key;
  };
  this.getDataKey = function() {
    if (this.dataKey) {
      return this.dataKey;
    }
    return "SideBar" + this.menu;
  };
  this.setPreloadData = function(dataArray) {
    this.preloadData = dataArray;
  };
  this.getPreloadData = function() {
    if (typeof this.preloadData !== 'undefined' && this.preloadData !== null) {
      return this.preloadData;
    }
    return [];
  };
  this.getCurrentElement = function() {
    var elementsData = getElements;
    return elementsData[currentElement];
  };
  this.refreshElements = function() {
    window.setTimeout(function() {
      this.clearElements();
    }.bind(this), 1);
    //outer `this` context is bound to the handler
    window.setTimeout(function() {
      this.addElements();
    }.bind(this), 2);
  };
  this.deleteElement = function() {
    var newArr = [];
    var elementsData = this.getElements();
    for (var i = 0, l = elementsData.length; i < l; i++) {
      if (i != index) {
        newArr.push(elementsData[i]);
      }
    }
    dataManager.setItem(this.getDataKey, JSON.stringify(newArr));
  };
  this.addElements = function() {
    var elementsData = this.getElements();
    var menuNode = document.getElementById(this.menu);
    console.log(elementsData);
    for (var i = 0; i < elementsData.length; i++) {
      var li = document.createElement("li");
      var div = document.createElement("div");
      li.value = i;
      div.classList.add("list");
      var p = document.createElement("p");
      p.id = "textBlock";
      p.style.display = "inline";
      p.setAttribute("contentEditable", false);
      p.appendChild(document.createTextNode(elementsData[i].name));
      div.appendChild(p);
      var obj = getObject();
      console.log(obj);
      div.onclick = function(e) {
        e.stopImmediatePropagation();
        if (this.querySelector("#textBlock").contentEditable == "false") {
          this.currentElement = this.parentNode.value;
          elementsData = this.getElements();
          document.getElementById("prompt").innerHTML = elementsData[this.parentNode.value]["data"];
          document.querySelector("#wrapper").classList.toggle("toggled");
        }
      };
      var span2 = document.createElement("span");
      span2.id = "deleteMode";
      span2.classList.add("glyphicon");
      span2.classList.add("glyphicon-minus");
      span2.onclick = function(e) {
        e.stopImmediatePropagation();
        deleteItem(this.parentNode.parentNode.value);
        window.setTimeout(this.refreshElements, 1);
      };
      span2.style.display = "none";
      div.appendChild(span2);
      var span = document.createElement("span");
      span.id = "editMode";
      span.classList.add("glyphicon");
      span.classList.add("glyphicon-pencil");
      span.onclick = function(e) {
        e.stopImmediatePropagation();
        // get href of first anchor in element and change location
        for (var j = 0; j < menuNode.length; j++) {
          menuNode[j].classList.add("disabled");
        }
        this.style.display = "none";
        this.parentNode.querySelector("#deleteMode").style.display = "";
        this.parentNode.classList.add("editableMode");
        this.parentNode.classList.remove("disabled");
        var textBlock = this.parentNode.querySelector("#textBlock");
        textBlock.setAttribute("contentEditable", true);
        this.placeCaretAtEnd(textBlock);
        textBlock.onkeydown = function(e) {
          if (e.keyCode == 13) {
            e.stopImmediatePropagation();
            var text = this.innerHTML.replace("&nbsp;", '');
            text = text.replace("<br>", '');
            if (text.length > 0) {
              this.innerHTML = text;
              elementsData[this.parentNode.parentNode.value]['name'] = text;
              dataManager.setItem("IFTeleprompterScripts", JSON.stringify(elementsData));
              for (var j = 0; j < menuNode.length; j++) {
                menuNode[j].classList.remove("disabled");
              }
              this.parentNode.classList.remove("editableMode");
              this.setAttribute("contentEditable", false);
              this.parentNode.querySelector("#editMode").style.display = "";
              this.parentNode.querySelector("#deleteMode").style.display = "none";
            } else {
              return false;
            }
          } else if (e.keyCode == 8) {
            if (textBlock.innerHTML.length - 1 === 0) {
              textBlock.innerHTML = "&nbsp;";
            }
          }
          return true;
        };
        return false;
      };
      div.appendChild(span);
      li.appendChild(div);
      scriptsNode.appendChild(li);
    }
    var li = document.createElement("li");
    var div = document.createElement("div");
    var span2 = document.createElement("span");
    span2.id = "addMode";
    span2.classList.add("glyphicon");
    span2.classList.add("glyphicon-plus");
    div.appendChild(span2);
    var p = document.createElement("p");
    p.id = "textBlock";
    p.style.display = "inline";
    p.setAttribute("contentEditable", false);
    if (typeof this.addElementName !== 'undefined' && this.addElementName !== null)
      p.appendChild(document.createTextNode(" " + this.addElementName));
    else
      p.appendChild(document.createTextNode(" Add " + this.menu));
    div.appendChild(p);
    li.onclick = function(e) {
      e.stopImmediatePropagation();
      var newPushElementName = "New " + this.menu;
      if (typeof this.addElementName !== 'undefined' && this.addElementName !== null) {
        newPushElementName = this.addElementName;
      }
      elementsData.push({
        "name": newPushElementName,
        "data": ""
      });
      dataManager.setItem(this.getDataKey, JSON.stringify(elementsData));
      this.refreshElements();
    };
    li.appendChild(div);
    menuNode.appendChild(li);
  };
  this.placeCaretAtEnd = function(el) {
    el.focus();
    if (typeof window.getSelection != "undefined" && typeof document.createRange != "undefined") {
      var range = document.createRange();
      range.selectNodeContents(el);
      range.collapse(false);
      var sel = window.getSelection();
      sel.removeAllRanges();
      sel.addRange(range);
    } else if (typeof document.body.createTextRange != "undefined") {
      var textRange = document.body.createTextRange();
      textRange.moveToElementText(el);
      textRange.collapse(false);
      textRange.select();
    }
  };
}();
var sid = SIDEBAR.on('test');
sid.load();
<ul class="sidebar-nav" id="test">
</ul>