如何在play framework项目中从javascript更新img的src？

我的HTML文件中有这样一个图像

<img src="@routes.Assets.versioned("images/bell.png")" width="200", height="200" id = "symbolImg">

但形象没有改变。这是输出

编辑1

还尝试了这些转义字符的方法。没有效果

 document.getElementById("symbolImg").setAttribute("src", "@routes.Assets.versioned(\"images/bell.png\")" );

正确的长期解决方案 所有播放URL都通过路由器进行管理，因此如果需要，您可以轻松查找和更改它们

在Twirl模板中，您可以将URL作为

@routes.Assets.versioned（“images/bell.png”）

获取，因为

@…

是一个动态语句，所以它在HTML输出中变成了

/Assets/images/cherry.png

（好吧，如果您将添加

sbt digest

插件，因为它必须具有版本控制，那么在生产中，您将获得类似

/assets/images/aaf51231818fb cherry.png

）的内容）

不能在JavaScript客户机文件中使用

@

，因为它是一个客户机，

@

不会被动态替换（但是，如果动态生成JavaScript文件作为旋转模板，则可以使用它，然后在生成该JavaScript文件的瞬间在服务器上进行替换）

在客户端javascript上使用播放路由的正确方法是生成它们并从服务器加载。这是这里描述的一个特例：

简言之：

在控制器中创建

javascriptRoutes

操作：

def javascriptRoutes = Action { implicit request =>
  Ok(
    JavaScriptReverseRouter("jsRoutes")(
      routes.javascript.Assets.versioned
    )
  ).as("text/javascript")
}

添加对应路由：

GET     /javascriptRoutes      controllers.Application.javascriptRoutes

加载javascript路由器

<script type="text/javascript" src="@routes.Application.javascriptRoutes"></script>

错误和快速的解决方案 您的解决方案只是暂时的解决方案

document.getElementById("symbolImg").setAttribute("src", "/assets/images/cherry.png" );

请注意，在这种情况下，如果项目将在带有

sbt digest

插件的生产环境中运行，那么您的

/assets/images/cherry.png

将是404。

document.getElementById（“symbolMg”）.setAttribute（“src”，“@routes.assets.version（'images/cherry.png'）

不要用这个，试试这个

---

document.getElementById（“符号化”）.src='your image path'；

查看浏览器中呈现的HTML。现有图像的路径看起来与您最初编写的路径非常不同…@Teemu它有什么不同？我几乎是从HTML复制了src以放入javascript。第二个图像的唯一区别是它有“而不是”“。我现在也更改了它，使两者完全相同。仍然不起作用。我指的是实时文档，而不是您服务器上的文件。@Teemu抱歉，我不了解您的意思。我是这方面的初学者。如何检查？感谢您提供的详细答案：）

<script type="text/javascript" src="@routes.Application.javascriptRoutes"></script>

document.getElementById("symbolImg").setAttribute("src",jsRoutes.controllers.Assets.versioned("images/favicon.png" ).url)

document.getElementById("symbolImg").setAttribute("src", "/assets/images/cherry.png" );