每次新点击都可以产生新图片吗？

我知道如何使用onclick或onMouseOver来显示图像，但我怎样才能让每次点击都能产生合适的图像，而不仅仅是在同一个地方，但是，例如，在一行中，它旁边的前一个外观？我的想法是这样的：我点击参考1，图片1出现。然后点击reference2，picture2显示在已经显示的picture1旁边。现在我再次点击reference1，我想连续看1,2,1张图片。我怎样才能做到这一点？我的理想是在填满时看到行滚动，并删除该行中最后一个图像的删除按钮，甚至可以从文本字段中调出图片，但我可以自己搜索这些图片。现在我最关心的是新点击=新图像。谢谢。每次新点击都可以产生新图片吗？

来源

2012-07-28 Simon Konecny

什么语言？另外，请考虑使用正确的语言特定标签标记您的问题;它会以这种方式获得更快的关注。 – atomicinf 2012-07-28 20:08:16

什么编程语言？ – thefragileomen 2012-07-28 20:09:29

假设这是相对简单 - 您可以跟踪图像列表中的当前位置，然后创建一个处理当前图像然后增加此位置的函数。让onClick事件调用这个函数，并且在那里。

在这一行动的一个例子，使用JQuery，在这里可以查看： http://jsfiddle.net/8Q4LQ/

来源

2012-07-28 20:29:55 Zoey

下面是一个例子。

<html> 
    <head> 
    <style> 
     .refimg { width: 100px; height: 100px; } 
     .choices a { margin-right: 2ex; } 
     .choices img { display: none; } 
     #target { display:block; width: 500px; overflow-x: scroll; border: 1px solid black; } 
    </style> 
    </head> 
<body> 
    Choices: 
    <div class="choices"> 
    <a href="#" onclick="return putImage(image1);">ref1</a> 
    <a href="#" onclick="return putImage(image2);">ref2</a> 
    <image id="image1" src="image1.gif" class="refimg" /> 
    <image id="image2" src="image2.gif" class="refimg" /> 
    </div> 
    <br /> 
    Selections: <input type="button" value="Delete" onclick="delImage()" /> 
    <nobr id="target"> 
    </nobr> 

    <script> 
    function putImage(src) { 
    var a = src.cloneNode(true); 
    a.id = ''; //clear id to prevent duplicate id 
    target.appendChild(a); 
    a.scrollIntoView(true); 
    return false; 
    } 
    function delImage() { 
    var a=target.children; 
    if (a.length>0) target.removeChild(a[a.length-1]); 
    } 
    target.style.height=((target.offsetHeight-target.clientHeight)+100)+'px'; //extend height for scroll bar 
    </script> 

    </body> 
</html>

来源

2012-07-29 20:25:16 Jay

每次新点击都可以产生新图片吗？

回答

相关问题