Question

我试图通过调用一个返回路径的javascript函数来设置'src'：

<img src="getImagePath()" />

功能：

function getImagePath(){

     return "images/image1.png";

}

但它似乎不起作用。我缺少什么？感谢任何人指点我正确的方向。

Answer 1

src属性采用的是URL，而非JavaScript。您可能想尝试

<img src="pixel.gif" onload="this.onload=null; this.src=getImagePath();" />

Answer 2

你不能这样做。解释html时，src元素的img属性不能解释为javascript。

但你可以这样做：

<img id=someImage>

<script>
    function getImagePath(){
     return "images/image1.png";
   }
   document.onload = function(){
       document.getElementById('someImage').src=getImagePath();
   };
</script>

Answer 3

在Eugen's answer的基础上，我想要一些不需要托管pixel.gif图像的自包含（无ID，尽可能内联）。我想出了一些可能性：

一个选项将改为使用base64编码的src网址（如small as possible）。请注意，数据uris受支持in IE8+：

<img src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" onload="this.onload=null; this.src=getImagePath();">

在jsfiddle上查看此操作。

第二个选项是使用document.write直接使用内联脚本编写图像标记。只需将<script>代替<img>。请注意，许多人认为document.write为bad practice：

<script>
  function getImagePath() {
    return "http://i.imgur.com/4ILisqH.jpg";
  }
  document.write('<img src="'+getImagePath()+'">');
</script>

在行动on codepen.io中查看。

第三个（可能更为hackish）选项是通过提供null src强制破坏图像，（ab）使用onerror回调。

这适用于IE11和Chrome，但不适用于Firefox ：

<img src onerror="this.onerror=null; this.src=getImagePath();">

在jsfiddle上查看此操作。

第四个选项依赖于一个简单的函数，该函数设置一个<img>标记，后面紧跟一个内联<script>，它通过JavaScript设置图像的src：

<!-- In the <body> -->
<img><script>set_most_recent_img_src(getImagePath())</script>

在您的<head>：

中

<!-- In the <head> -->
<script>
  function getImagePath() { return "https://www.gravatar.com/avatar/71ec7895cada78741057c644d858b0e3"; }

  function set_most_recent_img_src(val) {
    var a = document.body.getElementsByTagName('IMG');
    var img = a?a[a.length-1]:0;
    if (img) img.src = val;
  }
</script>

在codepen.io上查看此操作。

摘要：我只是在思考。每个选项都有不同的含义和要求 - 它们都是变通方法，应该针对您的具体用例进行彻底测试。我个人认为第一个选项（base64 URI）是最可靠的（如果你忽略旧的IE浏览器，我很乐意）。

Answer 4

https://stackoverflow.com/a/17229404/487771

<script type="text/javascript">
 var country = $("#SCountry").val();
 document.getElementById("iframeid").setAttribute("src","https://domain.com/country="+country)
 </script>

Javascript函数返回src路径

4 个答案: