Javascript Backbone.js音频控制

我有一个主干视图，它使用html模板，放置在页面上：

<script type="text/template" id="webphone-template">
            <audio id="audio-ringtone" src="{% static "prime_app/assets/audio/ringtone.mp3" %}"></audio>
            <div class="well">
                <p class="text-muted text-center"><%= status %></p>
                <div class="text-center">
                    <button id="btn-webphone-answer" class="btn btn-success">
                        <i class="fa fa-phone"></i>
                    </button>
                    <button id="btn-webphone-terminate" class="btn btn-danger">
                        <i class="fa fa-phone"></i>
                    </button>
                </div>
            </div>
        </script>

---

但是当调用此方法时，音频不播放，JS控制台中没有错误，音频元素选择正确。有什么问题吗？

我不知道您的整个视图是如何工作的，如果您添加它，我可以修改代码，但我让它工作起来相当简单。同样，我需要查看您的视图代码，以查看您做错了什么

View = Backbone.View.extend({
    template: _.template($('#webphone-template').html()),
    events: {
        'click #btn-webphone-answer': 'ring'
    },
    initialize: function(opt) {
        // attach to the main body
        $(opt['main']).append(this.el)
        this.status = 'paused';
        this.render();
    },
    ring: function() {
        $(this.el).find('#audio-ringtone')[0].play()
    },
    render: function() {
        $(this.el).append(this.template({status: this.status}));

        return this;
    }
});

new View({ main: $('body') });

---

工作原理：

最后，出现了以下问题：audio标记位于我视图的元素中，当我调用render（）时，它完全替换元素中的所有HTML，因此如果有audio元素，它将被删除，声音不再播放

View = Backbone.View.extend({
    template: _.template($('#webphone-template').html()),
    events: {
        'click #btn-webphone-answer': 'ring'
    },
    initialize: function(opt) {
        // attach to the main body
        $(opt['main']).append(this.el)
        this.status = 'paused';
        this.render();
    },
    ring: function() {
        $(this.el).find('#audio-ringtone')[0].play()
    },
    render: function() {
        $(this.el).append(this.template({status: this.status}));

        return this;
    }
});

new View({ main: $('body') });