Question

我正在使用HTML和Javascript创建一个简单的图像滑块。我已经完成了以下操作仍然我的图像没有改变。请帮我纠正。

<script type="text/javascript">
var i=0;
var pic=new array()
pic[0].src='scks/0.jpg'
pic[1].src='scks/1.jpg'
pic[2].src='scks/2.jpg'
pic[3].src='scks/3.jpg'
pic[4].src='scks/4.jpg'

function prev()
{
    i--;
    if(i==(-1))
        i=4;
    document.images.slidre.src = eval("pic"+i+".src");
}
function next()
{
    i++;
    if(i==5)
        i=0;
    document.images.slidre.src = eval("pic"+i+".src");  
}
</script>
<table style="border:thin green solid" width="400px" align="center">
    <tr>
        <td style="border:thin lime solid"><img src="scks/0.jpg" width="400px" height="300px" name="slidre"/>
        </td>
    </tr>
    <tr>
        <td style="border:thin lime solid">
        <span onclick="prev()" style="float:left">Prev</span>
        <span onclick="next()" style="float:right">Next</span></td>
    </tr>
</table>

由于

Answer 1

第一个错误是数组初始化，其次是数组中的填充对象，只需将src直接插入到图像中。

最后评论：你不应该使用eval来获取数组元素。代码应如下所示：

<script type="text/javascript">
var i=0;
var pic=new Array(5);
pic[0]='scks/0.jpg';
pic[1]='scks/1.jpg';
pic[2]='scks/2.jpg';
pic[3]='scks/3.jpg';
pic[4]='scks/4.jpg';

function prev()
{
    i--;
    if(i==(-1))
        i=4;
    document.images.slidre.src = pic[i];
}
function next()
{
    i++;
    if(i==5)
        i=0;
    document.images.slidre.src = pic[i];  
}
</script>
<table style="border:thin green solid" width="400px" align="center">
    <tr>
        <td style="border:thin lime solid"><img src="scks/0.jpg" width="400px" height="300px" id="slidre"/>
        </td>
    </tr>
    <tr>
        <td style="border:thin lime solid">
        <span onclick="prev()" style="float:left">Prev</span>
        <span onclick="next()" style="float:right">Next</span></td>
    </tr>
</table>

Answer 2

修改你的功能

 var i=0;
var pic = new Array()
pic[0]='scks/0.jpg'
pic[1]='scks/1.jpg'
pic[2]='scks/2.jpg'
pic[3]='scks/3.jpg'
pic[4]='scks/4.jpg'
alert(pic.length)
function prev()
{

    i--;
    if(i==(-1))
        i= pic.length;
    document.images.slidre.src = pic[i];
}
function next()
{
    i++;
    if(i==pic.length)
        i=0;
    document.images.slidre.src =  pic[i] ;  
}

图像滑块使用HTML

2 个答案: