Question

在html页面中使用not defined事件调用嵌套函数时，在控制台上出现onClick错误。我尝试搜索其他帖子上的答案，但未能成功。我认为这是范围或关闭问题。但是不太确定如何解决它。

我使用html提取外部.js文件，并在下面具有以下功能。我在mySelection1函数中调用主函数checkMySelection。并在mySelection1事件的主html上的onClick中调用嵌套函数。目标是根据其单击的按钮来更改currentPage变量（最初在.js文件的开头声明为全局变量。）

//first function
 function mySelection1() { 
  alert("in mySelection1 function");
  var SubMenu1 = function() {
    currentPage = 1;
    alert("current XML node is " + currentPage);
  };
  var SubMenu2 = function() {
    currentPage = 2;
    alert("current XML node is " + currentPage);   
  };
  var SubMenu3 = function() {
    currentPage = 3;
    alert("current XML node is " + currentPage);   
  };
}
//second function
function checkMySelection() {

  SearchString = window.location.search.substring(1);
  VariableArray = SearchString.split('=');
  mySelection = VariableArray[1];
  console.log(mySelection); 

  switch (mySelection) {
    case '1':
      alert("Case 1");
      mySelection1();
    break;
    case '2':
      //alert("Case 2");
      //mySelection2();
    break;
    default:
      alert("Something went wrong...");
  }
}

<! -- CODE IN HTML BELOW -->

<button id="defaultItem" class="menuItem active" onclick="openItem(event, 'item1'); SubMenu1()">Item 1</button>
          <button class="menuItem" onclick="openItem(event, 'item2'); SubMenu2()">Item 2</button>
          <button class="menuItem" onclick="openItem(event, 'item3'); SubMenu3()">Item 3</button>

看起来像嵌套函数被完全忽略了...：/我缺少什么？还有更好的方法吗？

****下面更新**** 大家好，请看一下现代模式以解决原始问题...我从以下内容开始，而不是函数方法中的嵌套函数...

//Using Object Literal Notation
var mySelection1 = {
  mySubMenu1: function() {
    currentPage = 1;
    alert("current XML node is " + currentPage);
  },
  mySubMenu2: function() {
    currentPage = 2;
    alert("current XML node is " + currentPage);   
  },
  mySubMenu3: function() {
    currentPage = 3;
    alert("current XML node is " + currentPage);   
  }
}

我知道要调用必须使用mySelection1.moduleSubMenu1（）;的函数； mySelection1.moduleSubMenu2（）;和mySelection1.moduleSubMenu3（）;我将它们添加到了html页面按钮中...因为我只希望它们在按钮onClick事件上被调用。

<button id="defaultItem" class="menuItem active" onclick="openItem(event, 'video'); mySelection1.moduleSubMenu1()">Video</button>
<button class="menuItem" onclick="openItem(event, 'resources'); mySelection1.moduleSubMenu2()">Resources</button>
<button class="menuItem" onclick="openItem(event, 'quick-check'); mySelection1.moduleSubMenu3()">Quick Check</button>

如果我仅使用一个对象，这将非常有效...但是，这将我带到了我要解决的问题（为什么我以前尝试使用嵌套函数）...我该怎么做？ var对象可重用？ 'currentPage'var索引值必须根据它们来自哪个'card'来更改（本文的评论中的上下文）...我需要另一个具有相同功能的对象才能更改'currentPage'。 ..即

    //Second object needed
    var mySelection2 = {
      mySubMenu1: function() {
        currentPage = 6;
        alert("current XML node is " + currentPage);
      },
      mySubMenu2: function() {
        currentPage = 7;
        alert("current XML node is " + currentPage);   
      },
      mySubMenu3: function() {
        currentPage = 8;
        alert("current XML node is " + currentPage);   
      }
    }

这很好，但是问题是我想使用相同的子菜单项，并且它们已经在onClick上具有先前的object.function ...

<button id="defaultItem" class="menuItem active" onclick="openItem(event, 'video'); mySelection1.moduleSubMenu1()">Video</button>
<button class="menuItem" onclick="openItem(event, 'resources'); mySelection1.moduleSubMenu2()">Resources</button>
<button class="menuItem" onclick="openItem(event, 'quick-check'); mySelection1.moduleSubMenu3()">Quick Check</button>

Answer 1

您的代码中有很多未声明的内容，因此调试起来有些困难。但是，您的语法有一些问题，这是代码。

perl=TRUE

调用嵌套函数onClick事件无法识别嵌套函数

1 个答案: