HTML5 音频和 jQuery答案

【问题标题】：HTML5 Audio and jQueryHTML5 音频和 jQuery
【发布时间】：2011-09-29 03:46:11
【问题描述】：

我正在尝试使用按钮在使用 jQuery 的 HTML5 音频标签中开始曲目，但我不断收到错误消息。

var song = $('#audio');

$('#play').click(function() {
song.play();
});

当我使用 document.getElementById('audio') 时，它可以工作，但是当使用 jQuery 选择器时，我收到以下错误：

Uncaught TypeError: Object [object Object] has no method 'play'

感谢您的帮助。

【问题讨论】：

【解决方案1】：

而不是 .get() 只需使用对象表示法：

var song = $('#audio');

$('#play').click(function() {
    song[0].play();
});

打字少了:)

【讨论】：

【解决方案2】：

你也可以写成song.trigger('play');。这将允许您使用 $('#audio'); 选择器。

【讨论】：

【解决方案3】：

尝试获取原生 DOM 元素，因为 jQuery 对 $('#audio') 选择器返回的包装数组上的 .play 方法一无所知：

song.get(0).play();

【讨论】：

这行得通...为什么？能不能给个简单的解释，让我明白。谢谢！！
@user699242，当您使用$('..some selector..') 时，它会返回一个与您的选择器匹配的实际 DOM 对象数组。 .play 方法是一种原生 HTML5 方法，您需要在实际的原生 DOM 元素上调用它。所以你需要从 jQuery 选择器返回的数组中获取这个原生 DOM 元素。由于您使用的是 id 选择器 (#audio)，我们可以假设您的 DOM 中有一个元素与此选择器匹配，因此我们可以安全地使用 .get(0) 来获取它。所以基本上当你使用 $(...) 时，你只能在结果上调用 jQuery 函数，而 play 不是
真的很有帮助。但是，为什么在使用.get(0).tagName时会报undefined error？