我使用以下函数动态加载JavaScript:

function loadJS(file, c)
{
    var jsEl = document.createElement("script");
    jsEl.type = "application/javascript";
    jsEl.src = file;
    jsEl.async = false;
    document.body.appendChild(jsEl);
    if (c) { jsEl.addEventListener('load', function (e) { c(null, e); }, false); }
    document.getElementsByTagName("head")[0].appendChild(jsEl);
}

以下是动态添加的文件中包含的功能之一:
function formelements_SELECT_add(x)
{
    console.log("add");
    alert("add");
    var id = x[1];
    var value = x[2];
    var index = x[3];
    var select = document.getElementById(id);
    var option;
    option = document.createElement("option");
    option.text = value;
    select.add(option, index);
}

我知道JavaScript文件已正确添加,并且函数已执行,因为option已添加到select元素。为什么alertconsole.log无法执行?如果单击检查,则没有错误消息。

编辑

这是我用来调用该函数的代码:
var typeAndElement = x[0][0] + "_" + x[0][1];
start = i + 1;
if (!window[typeAndElement])
{
    loadJS("https://websemantica.org/scripts/" + x[0][0] + "/" + x[0][1] + ".js", continueManipulatingElements(typeAndElement, actions, x, start, total));
    return;
}
else
{
    fn = window[typeAndElement + "_" + x[0][2]];
    if (typeof fn === 'function')
        fn(x);
}

我不想一开始就包含它,因为我已经知道它正在工作,并且考虑到它正在使用动态数据,目前尚不清楚它如何工作。

另外,我编辑了loadJS函数:
function loadJS(file, c)
{
    var jsEl = document.createElement("script");
    jsEl.type = "text/javascript";
    jsEl.src = file;
    jsEl.async = false;
    if (c) { jsEl.addEventListener('load', function (e) { c(null, e); }, false); }
    document.getElementsByTagName("head")[0].appendChild(jsEl);
}

该问题现在似乎已解决。

最佳答案

跳出三件事:

  • 您将脚本两次附加到页面,一次附加到document.body,另一次附加到document.getElementsByTagName("head")[0]。第二个脚本会将脚本从第一个位置移到第二个位置。您实际上只需要执行其中一项。
  • 附加元素后,您正在查找load事件。如果脚本在缓存中,则可能会丢失事件。在将脚本附加到DOM之前,先将其钩住。
  • 您没有在引用的代码中执行任何操作来调用要添加的脚本定义的函数。


  • 其他注意事项:
  • 无需设置type,默认为JavaScript。
  • 无需设置async,所有动态插入的script元素都是异步的(now并不总是正确的)。
  • 因为Jarosław Wlazło points out document.alert不是函数,您只需要alert。 :-)
  • 07-24 09:47
    查看更多