2

我正在使用以下 JavaScript。它工作正常,但它是从各种来源拼凑起来的一团糟。

  • 我有一系列图像。
  • 每个都有一个小版本 (1.gif) 和一个隐藏的、预加载的大版本 (_1.gif)。
  • 单击小版本,大版本将替换它。
  • 再次单击它会换回来:

    var lastMove;
    lastMove = new Date();
    
    function preload(arr) {for (var i=0; i<arr.length; i++) (new Image()).src = arr[i];}
    
    var index = 0;
    
    var picsA = ["1.gif", "_1.gif"];
    preload(picsA); picNumberA = 0;
    function showNextPicA() {if (new Date() - lastMove < 200) return false; if (picNumberA == (picsA.length -1)) {picNumberA = 0;} else {picNumberA = picNumberA + 1;}document.getElementById('placeholderA').src = pics1[picNumberA];}
    
    var picsB = ["2.gif", "_2.gif"];
    preload(picsB); picNumberB = 0;
    function showNextPicB() {if (new Date() - lastMove < 200) return false; if (picNumberB == (picsB.length -1)) {picNumberB = 0;} else {picNumberB = picNumberB + 1;}document.getElementById('placeholderB').src = picsB[picNumberB];}
    
  • 等页面上的每个图像是这样的:

    <img src="1.gif" id="placeholderA" onclick="return showNextPicA();"/>
    

所以,首先:这种混乱是危险的还是不必要的,还是很好?

第二:有没有办法自动化,所以任何图像文件都会在单击时切换到具有标准前缀(比如_)的版本,然后在再次单击时再次返回?

呸。谢谢阅读!

4

1 回答 1

0

If you are able to use sth like jQuery, in the onClick for each image, put

showNextPic($(this))

Then

var prefix = "_";
showNextPic(imgelement) {
    var src = imgelement.attr('src');
    if(src.indexOf(prefix) == -1) {
         src = prefix + src;
    }
    else {
         // remove prefix from src
    }
    imgelement.attr('src', src);
}
于 2012-07-04T20:49:32.203 回答