将javascript数组动态添加到img src答案

【问题标题】：dynamically add javascript array to img src将javascript数组动态添加到img src
【发布时间】：2013-05-30 17:58:00
【问题描述】：

我有一个 javascript 数组（不是 jquery），我可以提取 src 所需的代码：

var imp = code1 [5];
document.getElementById("prodimg").src=imp;

带有HTML的

<img  id="prodimg">

我正在尝试建立一个系统，按下 code2 将显示代码 2 的图片等。因此，当单击代码 2 时，var imp 将更改为 code2 [5]。

我让它在点击时处理其他一些数据，但我在写入将特定数组返回到 img 标记时遇到问题。

我的想法是这样的

  function changeimg(code)

或

 function changeimg (code, array)

function changeimg (code, [5])
{
  imp = code [5]
}

但它不起作用，我相信有更简单的方法

Js fiddle: http://jsfiddle.net/9aUq8 有一些破坏功能，每个按钮都会将图像的 src 更改为自己的数组

或者http://jsfiddle.net/9aUq8/1/ 显示数字 1，而 B[2] 的数组是数字 2。什么函数会调出 b[2] 显示数字 2 而不是 1。

【问题讨论】：

你想要的位置是不是一直通过多个数组5？我看到你有 code1[5] 和 code2[5] - 这是位置 5 的 2 个不同的数组。
你能创建一个小提琴来演示吗？真的很难听懂你在说什么。
是的，总是相同的数组位置，来自多个数组。类似于jsfiddle.net/9aUq8 的东西，每个按钮都会改变img
jsfiddle.net/9aUq8/1 将我无法使用的功能取出，也许还有更清晰的想法。点击B，出现显示2的图片
那个小提琴只在控制台中产生很多Uncaught ReferenceError: x is not defined消息。

标签： javascript html

【解决方案1】：

尝试使用window['name_array'][index]，就像本例中的函数一样。

<script>
var code1 = [1, 2, 3, 4, 5];
var code2 = ['a', 'b', 'c', 'd'];
function setCodeSrc(code, ix) {
  document.getElementById("prodimg").src = window[code][ix];
}

setCodeSrc('code1', 3);
</script>

或者更好，把数组变成一个对象。

<script>
var codes = {
  'code1': [1, 2, 3, 4, 5],
  'code2': ['a', 'b', 'c', 'd']
};

function setCodeSrc(code, ix) {
  document.getElementById("prodimg").src = codes[code][ix];
}

setCodeSrc('code2', 2);
</script>

【讨论】：

谢谢 - 我在 JS 上速度很慢，但看起来很有趣。但是是的，我认为第一个例子就是我想要的。 ix 是通用的吗？
ix 不是通用的，它只是一个属性/变量名。
是的对不起，我的意思是说ix不是一个绝对的javascript变量，而是为函数创建的相对变量，可以调用任何东西？

【解决方案2】：

CoursesWeb 可能要好得多，但我是这样做的：

    function displayArrayAsImage( array ) {

  var picurl = array[2];

  var html = 'img/';    

    html +=  picurl ;

  html += '.jpg';

  return html;
}

 var getimg = document.getElementById("prodimg");

//加载时插入图片

   getimg.src = displayArrayAsImage (code1);

//点击改变图片

function change(code)
{

    getimg.src = displayArrayAsImage (code); 

}

【讨论】：