在Django中,如何在没有POST请求的情况下触发AJAX请求?

时间:2020-05-16 14:43:04

标签: javascript django ajax audio

所以我是这里的新手,目前正在从事Django项目。所以我面临一个问题。让我对问题进行详细说明: 所以我有一个名为Music的模型:

class Music(models.Model):
    musicid = models.AutoField(primary_key=True)
    title = models.CharField(max_length=200)
    # category = models.ForeignKey(Category, on_delete=models.CASCADE, related_name='category')
    audio = models.FileField(upload_to='music/')
    published_at = models.DateTimeField(default=datetime.now , blank=True)
    def __str__(self):
        return str(self.musicid)

查看文件如下

def index(request):
    songs = Music.objects.all()
    context = {
        'title':'Home',
        'songs':songs,
    }
    return render(request , 'index.html',context)

所以现在在我的html中,我渲染了我存储在本地数据库中的所有音乐。

可以通过获取音频文件的URL轻松获取它们。现在,我为所有歌曲制作了一个通用播放器。真正的问题来了。

假设我有10首歌曲,并且单击其中的任意一首,如何发送带有特定音乐ID的AJAX请求,以便可以呈现该特定歌曲的音频网址。

//PLAYER SECTION WITH ONE SONG PLAY AT A TIME WITHOUT REDIRECTING TO OTHER PAGE
<section class="current-track" style="height:61.2px !important">

<audio id="music" class="current-track" >


<source src="{{songs.audio.url}}" type="audio/mpeg">


</audio>

这里的歌曲是特定歌曲ID的查询集。 我正在使用AJAX,因为很明显我不希望页面重定向到其他地方以获得更好的UI。我只想在单击监听器的基础上更改此音频文件的来源。我如何直接或通过此方式进行操作提取音乐ID到我的视图,然后触发AJAX请求以提取新的源文件?请事先帮助..... TYSM。^ __ ^ ''' //显示所有歌曲列表 {%for歌曲中的歌曲%}

                <div class="track__number">{{song.id}}</div>

                <div class="track__added">

                  <i class="ion-checkmark-round added"></i>

                </div>

                <div class="track__title">{{song.title}}</div>

                <div class="track__explicit">

                  <span class="label">Explicit</span>

                </div>

                <div class="track__plays">147,544,165</div>

              </div>

              <div class="track">

                <div class="track__art">

                  <img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/7022/tth.jpg" alt="These Things Happen" />

                </div>

{%endfor%} '''

0 个答案:

没有答案