Question

我有基于用户输入的 PHP 代码生成的 HTML 菜单，我在同一PHP文件上应用了 JavaScript 函数在<script>标签内包含菜单代码。每次创建菜单时，我都会给它一个不同的类，然后运行JavaScript函数来管理菜单单击事件以扩展或折叠子菜单。此函数使用菜单的动态创建的类在运行时声明其函数名称，然后使用以下任一方法加载该函数：

window.onload = function_generated_name;

OR

window.addEventListener('load', function_generated_name);

以上对于一个菜单都适用。如果我创建第二个菜单，则window.onload事件将运行2次，最后一个将替换第一个。该功能仅适用于最后一个菜单。如果我添加了第三个菜单，则该菜单仅自动适用于第三个菜单。

创建菜单是否有更好的解决方案？

或者应该多次使用window load事件。我已经在一个负载中调用了多个JavaScript函数，该负载已经在1个可用时间中在同一页面上创建。显然，就我而言，我将调用此文件来创建菜单并加载JavaScript window.onload事件，然后再次发生该事件，以替换第一个on load事件。

我尝试了来自不同来源的基本JavaScript菜单代码，但是我需要更改运行时间，将菜单置于鼠标悬停或可点击的位置。

这是脚本标签中php文件中调用的函数，每次创建菜单时，我都会调用此php文件并执行以下JavaScript代码：

rand = '<?php echo $random_generated_number_in_php ?>'

"use strict";
var type = 'menu';
var menu_name = type.concat(rand);
var customFunction = function() {    
    var mymenu = document.getElementsByClassName(rand)[0].getElementsByClassName("list_item");
    if (!mymenu) { return; }
    else {
        for (var i=0;i<mymenu.length;i++) {
            mymenu[i].onmouseover = hoverMyMenu;
        }
     }
}
var func = "func";
var func_submenu = func.concat(menu_name)
func_submenu = new Function("action", "return function " + menu_name + "(){ action() };")(customFunction);
window.addEventListener('load', func_submenu);

JavaScript window.onload仅适用于最后一次调用

0 个答案: