建议为选择图像创建代码

Advice to create a code for selectin image

本文关键字:创建 代码 图像 选择      更新时间:2023-09-26

我想创建一个函数(javascript),其中一些图像显示在屏幕上,用户只需单击即可选择其中一个。选择后,图片的 src 将存储在变量中。到目前为止,我制作了一个图像数组,但我不知道这是否是正确的方法,你们中有人有一些提示吗?谢谢大家!

 <script typre="text/javascript">
        var img = new Array();
        img[0] = new Image();
        img[0].src = "../images/poggiatesta2.jpg";
        img[1] = new Image();
        img[1].src = "../images/poggiatesta1.JPG";
        for (var i = 0; i < img.length; i++) {
            document.body.appendChild(img[i]);
        };
        </script>

试试这个:

var img = new Array();
  img[0] = new Image();
  img[0].src = "http://dummyimage.com/200/000/fff&text=Img0";
  img[1] = new Image();
  img[1].src = "http://dummyimage.com/200/000/fff&text=Img1";
  img[2] = new Image();
  img[2].src = "http://dummyimage.com/200/000/fff&text=Img2";
for (var i = 0; i < img.length; i++) {
  var imagetag = document.createElement("img");
  var onclick = document.createAttribute("onclick");
  onclick.value = "myfun("+i+")";
          
  var sorc = document.createAttribute("src");
  sorc.value = img[i].src;
          
  var id = document.createAttribute("id");
  id.value = "my_image"+i;
          
  imagetag.setAttributeNode(onclick);
  imagetag.setAttributeNode(sorc);
  imagetag.setAttributeNode(id);
          
  document.body.appendChild(imagetag);
};
function myfun(i) {
  var src = document.getElementById('my_image'+i).src;
  //you can do anything with 'src' here
  document.getElementById('demo').innerHTML = src;    //for demo purpose
}
<p id="demo"></p>