Question

为什么 js 脚本在 django 网站上不起作用？

2019-07-13

260

javascript python django

我是 Django 和 JS 的新手。尝试使用自定义控件创建 HTML5 音频播放器。当我启动页面时，什么都没有发生。

使用默认播放器测试了这个 mp3，一切正常。所以我认为静态设置是正确的。

文件夹结构：

..stream (the app)
....static
......stream
........audio
..........test.mp3
........scripts
..........player.js
....templates
......index.html

这是我的 index.html。基本模板几乎是空的。

{% extends "base_generic.html" %}

{% block content %}
    {% load static %}
    <script src="{% static "stream/scripts/player.js" %}" type="text/javascript"></script>
    <audio src="{% static "stream/audio/test.mp3" %}" type="audio/mpeg">
{% endblock %}

这是我的 player.js

var aud = $('audio')[0];
aud.play();

我希望当我打开页面时，音乐会开始播放。

Answer 1

问题来自 JS 脚本的执行。浏览器执行

var aud = $('audio')[0];
aud.play();

或

document.getElementsByTagName('audio')[0].play();

时，音频块尚未创建，因此查询无法找到任何内容，您会收到错误

Uncaught TypeError: Cannot read property 'play' of undefined

您可以使用以下函数延迟执行：

document.addEventListener('DOMContentLoaded', function(){
    var aud = document.getElementsByTagName('audio')[0];
    aud.play();
}, false);