Django音频播放器

时间:2019-09-07 17:20:13

标签: django html5-audio

我正在开发django音乐应用,并且有一个名为Song的模型。

class Song(models.Model):
    user        = models.ForeignKey(settings.AUTH_USER_MODEL)
    ...
    audiotrack  = models.FileField(upload_to=upload_image_path)
    likes       = models.ManyToManyField(settings.AUTH_USER_MODEL,blank=True,related_name='track_likes')

它作为对象列表在模板中传递。

def list_view(request):
    songs = Song.objects.all()
    context = {
        'tracks_list' : songs
    }
    return render(request,"musica/list.html",context)

在模板中,我循环浏览对象并将它们链接到音频播放器。

<audio id="player" src="{{ object.audiotrack.url }}"></audio>
<button onclick="document.getElementById('player').play()"></button> 

这就是问题所在。

按钮保持不变,并始终播放相同的曲目。

我已经有一个喜欢的按钮来播放歌曲,这是一个ManyToMany Field。

class TrackLikeToggle(RedirectView):
    def get_redirect_url(self,*args,**kwargs):
        id = self.kwargs.get("id")
        obj = get_object_or_404(Song,id=id)
        url_ = obj.get_absolute_url()
        user = self.request.user
        if user.is_authenticated():
            if user in obj.likes.all():
                obj.likes.remove(user)
            else:
                obj.likes.add(user)
        return url_

我需要为“播放”按钮做些类似的事情吗? 称为播放的OneToOne字段可切换音频播放器吗?

但是考虑到播放器链接,这在模板中如何工作:

<button onclick="document.getElementById('player').play()"></button> 

谢谢您的任何建议

1 个答案:

答案 0 :(得分:0)

我可以想象getelementbyid是问题所在,所有循环遍历的音频标签都具有相同的ID,因此JS才开始播放第一个。