demo

Question

我正在尝试做一些比我以前更复杂的事情，我希望你们可以帮助我这个......我正在开发的网站需要这种类型的Psudo

<script>
function FirstPic(){
        document.titlepic.src = document.rep1.src
        return
    }

function SecPic(){
        document.submitpic.src = document.rep2.src
        return
    }
</script>

// Calling Image Replacements
<img style="visibility:hidden;width:0px;height:0px;" name="rep1" src="title2.gif>
<img style="visibility:hidden;width:0px;height:0px;" name="rep2" src="submit2.gif>
// End of Calling Image Replacements

// Output Area
<img src="title.gif" name="titlepic">

<input type="radio" onclick="FirstPic();SecPic();updateProductPrice(this);parent.specs.location='<?php echo $options_item['base_var'] ?>.htm';">

<img src="submit.gif" name="submitpic">
// End of Output Area

Answer 1

只需单击一下，即可替换所需数量的图像。单个函数，每个图像不需要函数。

demo

<强> HTML ：

<img src='source-img-1.jpg' class='s'>
<!-- as many source images as you would like -->
<button id='replace'>Replace</button>
<img src='destination-img-1.jpg' class='d'>
<!-- as many destination images as you have source images -->

<强>的JavaScript ：

var r = document.getElementById('replace');

r.addEventListener('click', function(){
  var s = document.querySelectorAll('.s'),
      d = document.querySelectorAll('.d'), 
      l = s.length;
  if(d.length != l) return;
  for(var i = 0; i < l; i++) d[i].src = s[i].src;
}, false);

另外，使用CSS样式表，不要使用内联样式。

只需单击即可替换两个图像的SRC

1 个答案:

demo