Question

我正在使用BABYLONjs处理图形界面，我决定实现模式选择功能，这意味着您可以选择编辑模式或可视化模式。这两种模式各有不同的HTML组件，所以我选择编写一个构造脚本，它通过实现与所选模式相对应的正确元素来创建HTML。让我们把A.js称为构造脚本，然后使用我所有的函数来调用我的主脚本。

当我在B.js尝试获取一个HTML元素时，就像一个通过A.js插入的按钮，返回的值是 null （我得到了带文档的元素。的getElementById（ '元素'）。

我确保在我的HTML中包含B.js之前的A.js，所以我真的不明白为什么它不起作用。

如果您需要更多精确度，请随时提出。谢谢！

Answer 1

确保两个javascript文档都附加到同一个HTML文件中，以便document引用相同的内容。

还要确保您所做的一切都是同步的。例如，如果您使用的是window.addEventListener('onload')，那么这是异步的。这意味着该代码实际上并未运行，而是等待运行自身。与此同时，它可能决定运行你的B.js代码，此时你选择的元素还不存在。

如果这是问题，请在window.addEventListener('onload')内运行您的B.js脚本。

第三件事是你的A.js脚本可能在一个函数中，需要运行该函数才能将元素添加到DOM中。

如果没有实际代码，很难调试特定问题，例如您提供的问题。如果您需要更好的答案，请包含实际的演示代码，以便我们更好地确定问题。

编辑：代码已发布。

正如您发布的那样，在您的代码中，您正在定义构造函数，但随后告诉broswer在窗口加载时运行它。然后在调用构造函数之前运行A.js。有两种解决方案。

将您的整个B.j包裹在window.addEventListener("load")中，或者做一些完全不同的事情。

在A.js之前加入B.js，并定义一个名为B（）的函数。把所有代码都放在这里。然后，在构造函数的末尾调用B（）。这意味着B.js将被迫等到窗口加载。我希望这有帮助！

Answer 2

以下是我想要做的一个例子：

HTML：

 <!DOCTYPE html>
<html>

<head>
<title> Test </title>
    <meta http-equiv="Content-Type" content="text/html" charset="utf-8" />
</head>
<body id=inserthere>
  <header> 
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
      <!-- <script style="text/javascript" src="a.js" defer></script> --> 
      <!-- <script style="text/javascript" src="b.js" defer></script> -->
   <header>
</body> 
</html>

A.js：

function construction(){

$("#inserthere").append("<button id='testone' class='btn'> 1 </button>");
$("#inserthere").append("<button id='testtwo' class='btn'  > 2</button>");

}

window.addEventListener("load", construction);

B.js：

var test1 = document.getElementById("testone");
test1.addEventListener("click", function(){
alert("clicked");
});

var test2 = document.getElementById("testtwo");
test2.addEventListener("dblclick", function(){
alert("doubleclicked");
})

这些是试图重现我的情况的简短例子，希望它能帮到你！

Answer 3

我看到你使用jQuery。如果要在动态创建的元素上捕获事件，则应绑定到父元素（或文档）：

$(document).ready(function() {
   $(document).on("click","#testone",function() {
       alert("clicked");
   });
}

访问通过其他脚本插入的HTML元素

3 个答案: