将变量传递给代码 <input type="image" src="imageSrc;" >

Question

希望有人可以帮助菜鸟。非常感谢。

我有一个索引页面，其中包含指向数百个包含歌曲词的其他页面的链接。 我已经建立了每个歌曲页面，但是如果有一个 MASTER 页面从索引页面中获取一个变量并找到相应的单词（以 png 图形的形式存在）会简单得多。

我已经对第 1 步进行了排序 - 我可以使用以下方法将变量从索引页传递到母版页：

<a href="javascript: window.open('MUSIC/beatles/mastertest2.html?song=ER', '_parent')">

其中song=ER 是显示Eleanor Rigby 单词的变量。对于第 2 步，我还可以使用以下方法在母版页中检索该信息：

var imageSrc = (qs("song")+".png");  document.write(imageSrc);

这将显示文本ER.png，这是我要显示的图像的名称。

对于第 3 步，我正在尝试读取相同的变量：

<input type="image" src="imageSrc;">

显示图片。我已经搜索了这个论坛和其他论坛好几天了，没有任何建议对我有用。我可能错过了编码中必不可少的早期步骤？

更新：

我的主 html 文件有这个代码来检索变量：

function qs(search_for) {
    var query = window.location.search.substring(1);
    var parms = query.split('&');
    for (var i=0; i<parms.length; i++) {
        var pos = parms[i].indexOf('=');
        if (pos > 0 && search_for == parms[i].substring(0,pos)) {
            return parms[i].substring(pos+1);;
        }
    }
    return "";
}

它使用此代码显示变量（附加 .png）只是为了向我证明它正在通过：

var imageSrc = (qs("song")+".png");
document.write(imageSrc);

然后我尝试将变量输入例程以显示所选的 png。下一个脚本不起作用，但我现在正在努力尝试任何事情：

var imageSrc = (qs("song")+".png");
document.write(imageSrc);

<input type="image" src="@imageSrc;" border="0" value="Notes" onClick="placeIt(); showIt()">
<input id="song-image" type="image">
var imageSrc = 'ER.png';
var input = document.getElementById('song-image');
input.src = imageSrc;

Answer 1

如果我没听错的话，那很简单。你在找这个吗？

var input = document.createElement('input');
input.type = 'image';
input.src = imageSrc;
document.body.appendChild(input);

如果您可以使用 document.write 打印变量 imageSrc，那么您可以像上图那样使用它。

Answer 2

如果您的 HTML 页面中已经有 <input type="image">，则必须添加一个 id，然后使用

设置它的 src 属性

HTML：

<input id="song-image" type="image">

JS：

var imageSrc = 'http://www.lorempixel.com/200/100';
var input = document.getElementById('song-image');
input.src = imageSrc;

JSFiddle 用于测试。