0

我正在尝试在我的页面上实现音乐播放器。我有一个表格，每一行代表一首歌曲，第一个元素是一个按钮，其 id 是歌曲的 url。

        <tbody>
        {% for e in entries %}
            <tr>
                <td><button class="song btn" id="{{ e.url }}"><i class="icon-play-circle"></i></button></td>
                <td>{{ e.title }}</td>
                <td>{{ e.artist }}</td> 
                <td>{{ e.features }}</td>
                <td>{{ e.genre }}</td>
                <td><a href="/myapp/editsong/{{ e.id }}">Edit</a></td>
            </tr>
        {% endfor %}
        </tbody>

我正在尝试实现一些 javascript 来更改页面上 HTML5 音频元素的 src，当单击按钮到其 id 时：

$("button.song").on("click", function(event){
    if (audio.src != event.target.id)
    {
      audio.src = event.target.id;
      play.className = 'btn btn-success';
      pause.className = 'btn';
      audio.play();
  }
});

这个实现有点工作，但有很多错误。有时单击按钮会将音频元素 src 更改为空白，我将不得不多次单击该按钮。

4

2 回答 2

1

我真的不确定，但是您应该使用其他属性来存储您尝试运行的歌曲的 URL，如果我的记忆没有让我失望，那么对于允许的字符“范围”有限制身份属性。

也许 value 属性没有这个限制。虽然我会使用更多“仅字母数字”作为对对象/数组的引用，然后使用它来获取值。

问候！贡萨洛·G。

于 2012-05-31T22:30:45.013 回答
0

使用 javascript 警报检查参数 event.target.id 以进行调试。单击按钮以查看每个音频的值。

if (audio.src != event.target.id)
...
于 2012-05-31T22:22:48.340 回答