在源中播放带有井号的音频不起作用答案

【问题标题】：Playing audio with pound sign in the source doesn't work在源中播放带有井号的音频不起作用
【发布时间】：2019-02-09 02:23:41
【问题描述】：

我正在尝试播放源中带有井号的音频文件，但是当我尝试使用 new Audio() 对象播放音频文件时，JavaScript 给出了这个错误。

NotSupportedError: src 属性或分配的媒体提供者对象指示的媒体资源不合适。

这是创建 Audio 对象并播放它的函数。我将参数note 输出到控制台以确保指定了正确的路径并且它不仅仅是一个文件注释发现错误（双关语）。我尝试用\# 替换参数note 中的#，但这并没有做任何事情（没想到会，但在寻求帮助之前值得尝试）。

如果您需要查看其他使用的文件，请在GitHub 上查看。

/*
 *	Author:		Adam Oates
 *	Created:	2/7/2019
 *	Filename:	main.js
 *
 */

function playNote(note) {
	let audio = new Audio();
	audio.src = "res/tones/" + note + ".mp3";
	console.log("res/tones/" + note + ".mp3");
	audio.play();
}

$(document).ready(function() {
	
	let pdo = new PianoDream();
	
	// plan to have different piano layouts in the future
	$("main").load("res/layouts/defaultLayout.html", function() {
		$("div.key").on("click", function() {
			console.log($(this).text());
			playNote($(this).text());
		});
	});
	
});

【问题讨论】：

大声笑，错误的井号。这个 # 也称为井号。 WikiPedia
完整路径应该看起来像res/tones/A#0.mp3，但是当源中有井号时，我会收到上面提到的错误。
您需要对 # 字符进行 URL 编码。

标签： javascript html audio mp3 html5-audio

【解决方案1】：

对于其他想知道的人：正如 Alohci 所指出的，我必须对字符进行 URL 编码。然后，井号在 URL 中变为 %23。 JavaScript 实际上有一个名为encodeURIComponent() 的函数，可以为您编码字符。

您可以在此处查看列表或 URL 编码字符： https://www.w3schools.com/tags/ref_urlencode.asp

【讨论】：