帮助用一个简单的脚本切换2个图像,缩略图和全尺寸

Help with a simple script to togle 2 images, thumbnail and fullsize

本文关键字:图像 2个 全尺寸 略图 脚本 简单 一个 帮助      更新时间:2023-09-26

我是一个javascript新手。我有一个这样的脚本:

<html>
    <head>          
        <script type="text/javascript">
            var x= '<img id="im" src="thumbnail.gif">';
            switch (x)
            {
            case x=='document.getElementById("im")':
            document.getElementById('im').outerHTML='<img id="im" src="fullsize.gif">';
            break;
            case x!='document.getElementById("im")':
            document.getElementById('im').outerHTML='<img id="im" src="thumbnail.gif">';
            break;
            default: x;
            }
        </script>
    </head>
    <body>
        <span onclick="switch()">
            <img id="im" src="thumbnail.gif">
        </span>     
    </body>
</html>

我需要保持它的简单,但也使其工作使用开关功能。我在剧本中没有使用它们。我也不是在找幻灯片。

首先,您不希望在'document.getElementById("im")'周围加上引号,因为这意味着您正在寻找该字符串。第二,case语句不像那样工作,语法是case value,而不是case expression(表达式是==)。第三,你没有一个实际的函数调用。你正在调用switch,它不做任何事情…

试试这样写:

function swap(){
    switch(document.getElementById('im').outerHTML){
        case x:
            ...
            break;
        default:
            ...
            break;
    }
}
...
<span onclick="swap();">

应该修复您现有的代码。或者"正确的"方式更像是:

function swap(){
   var node = document.getElementById('im');
   node.src = node.src.indexOf('fullsize')>=0 ? 'thumbnail.gif' : 'fullsize.gif';
}
...
<span onclick="swap();">

哦,我解决了你原来的问题。