javascript - 动态路径变量来播放音频.mp3 文件 如何？ d3 javascript CoffeeScript

Question

我正在尝试在“鼠标悬停”时播放声音文件。当我硬编码 .mp3 文件的路径时，它起作用，代码如下所示。

不过，我的值(包括多个 .mp3 文件的路径)存储在 .csv 文件中。 我需要找到一种方法将路径值“馈送到”变量。

这是我的初始元素。有多个节点，从 .csv 解析中获取值。将鼠标悬停在上面时，我可以播放 - “硬编码路径” - .mp3 文件:

labelEnter.append("span")
  .attr("class", "bubble-sound")
  .attr("height", 40 )
  .attr("width", 70 )
  .attr("src",(d) -> "sounds/"+fileValue(d))
  .on("mouseover",  (d, i) -> playSound d.file)

playSound = (d) ->
    # hardcoded here in next line
  snd.setAttribute "src", "sounds/Hungarian_FSI_1_0.00.06.059-0.00.07.229.mp3"
  snd.load()
  snd.play()
  return

snd = new Audio()

onPlay = (e) ->
  snd = new Audio()
  snd.addEventListener "play", onPlay

我试图将从 .csv 解析的路径值放入 snd.setAttribute 语句中，即用一个变量替换硬编码路径，该变量保存该节点的路径值。 以下代码在 console.log 中显示了“file”的正确值，但显示“setAttribute”路径未定义

playSound = (d) ->
  file = fileValue(d)
      # console log shows desired value of 'file'
  console.log("Show me " + file)
      # 'file' undefined
  snd.setAttribute "src", "sounds/"+file
  snd.load()
  snd.play()
   on "mouseoverreturn

我的问题，初学者，如何操作/设置文件变量，以便它正确附加到源路径:setAttribute 语句中的“sounds/file-value-as-string-here”？非常感谢。

Answer 1

尝试这样的事情:

playSound = (d) ->
  file = fileValue(d)
      # console log shows desired value of 'file'
  console.log("Show me " + file)
      # 'file' undefined
  snd.setAttribute("src", "sounds/"+file); //<-- this line changed
  snd.load()
  snd.play()