有没有办法监听 `src` 属性的 `onload` 事件？（一个框架）

Question

有没有办法监听src属性的onload事件？我不能使用 <a-assets>，因为我使用的是 <a-sky>，因为 <a-assets> 似乎不适用于 <a-sky>。并尝试同时加载 <a-assets> 和 <a-sky> 的图像，但是先加载一个图像然后再加载另一个图像，这意味着加载时间增加了一倍。

听src属性的正确方法是什么？所以我可以在其中的图像加载后执行操作？

（我想避免在加载 <a-sky> 的 src 上的图像时出现空白场景。）

Answer 1

我找不到在这里可用的 load 等效事件，但 <a-assets/> 应该在这种情况下可用。如果 shorthand <a-sky/> 不适用于资产，您可以使用更长的形式：

<a-scene>
  <a-assets>
    <img id="my-asset" src="https://..." crossorigin="anonymous">
  </a-assets>
  <a-entity geometry="primitive: sphere;
                      radius: 5000;"
            material="src: #asset-id;
                      side: back;">
  </a-entity>
</a-scene>

Note: I don't know why crossorigin="anonymous" is necessary. It probably shouldn't be, but it is as of 08/07/16.

Answer 2

考虑一下：*"If the additional-layers of 'A-Frame or what-have-you' did not exist, could you attach a DOM event-handler to "属性 某物？

答案是 "No"："DOM objects" 生成和接收事件，但它们的属性没有。

因此，'A-Frame or what-have-you,' 必然 建立在 这些东西之上，因此完全依赖于它们，根据定义 "can do no more (or less)."

Answer 3

正如 Don 所说，在资产上使用 crossorigin 标志使其与您的 <a-sky> 一起使用。

一旦你有了它，你就可以像听普通的 DOM 事件一样收听 img.onload/loaded。下面我将一些代码包装在一个自动挂接到场景中的 A-Frame 组件中：

<script>
  // Do something on asset load.
  AFRAME.registerComponent('do-on-asset-load', {
    schema: {
      src: {type: 'selector'}
    },

    init: function () { 
      var el = this.el;
      var assetEl = this.data.src;
      assetEl.addEventListener('load', function () {
        // Do something with your element.
      });
    }
  });
</script>

<a-scene>
  <a-assets>
    <img id="my-asset" src="https://..." crossorigin="anonymous">
  </a-assets>
  <a-sky src="#my-asset" do-on-asset-load="#my-asset"></a-sky>
</a-scene>

如果您不使用资产，则必须进入 material 以获取内部创建的图像：

document.querySelector('a-sky').components.material.material.map.image

有没有办法监听 `src` 属性的 `onload` 事件？（一个框架）

Is there a way to listen to the `onload` events of `src` attributes? (A-frame)

javascript

aframe

有没有办法监听 `src` 属性的 `onload` 事件？ （一个框架）

Is there a way to listen to the `onload` events of `src` attributes? (A-frame)

javascript

aframe

有没有办法监听 `src` 属性的 `onload` 事件？（一个框架）