動態路徑變量播放音頻.mp3文件如何？ d3 JavaScript咖啡腳本

Question

我正在嘗試在“ mouseover”上播放聲音文件。 當我將.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()

Answer 2

感謝您的回復； 這是我的最終解決方案：

playSound = (d) ->
    file = fileValue(d)
    console.log("Show me " + file)
    snd.setAttribute("src", "#{file}")
    snd.load()
    snd.play()
    return

  snd = new Audio()

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