Javascript 基本幻灯片放映

我正在用JavaScript和jQuery创建一个幻灯片来显示一组图像

我的想法是在页面上放置3个div：

• 一个左键的
• 一个右键的
• 一个称为屏幕的屏幕将显示图像

这是我写的代码，但我不知道遗漏了什么。可能是

onload

事件

var now =0;
var image_array= 
[
    "../cabinets/001.jpg",
    "../cabinets/002.jpg",
    "../cabinets/003.jpg"
];
$("#left").click(left(  if(now<image_array.length)
    {
        now++;
        $('#screen').css('background-image', 'url("' + array[now] + '")');
    }));
$("#right").click(  if(now>0)
    {
        now--;
        $('#screen').css('background-image', 'url("' + array[now] + '")');
    });

var now=0；
变量映像\u数组=
[
“./文件柜/001.jpg”，
“./文件柜/002.jpg”，
“./文件柜/003.jpg”
];
$（“#左”）。单击（左）（如果（现在为0）
{
现在--；
$（'#screen'）.css（'background-image'，'url（'+array[now]+'））；
});

我重写了您的代码，结果如下：

1）您是否将jQuery库包括在项目中

2）在jQuery代码的行中：

$('#screen').css('background-image', 'url("' + array[now] + '")');

您使用了错误的数组名

array[now]

，您的数组是

image\u array

，因此必须将其重写为

image\u array[now]

3）您对

的定义。单击
功能不正确。必须将其定义为：
。单击（函数（）{…}），因此您的行将如下所示：

// left click
$("#left").click(function(){
    if(now > 0){            
        now--;
    }
    $('#screen').css('background-image', 'url("' + image_array[now] + '")');alert(now);
});

及

//右键单击
$（“#右”）。单击（函数（）{
if（现在

下面是正在使用的JSFIDLE解决方案：

下面是第二个更新了IF术语的解决方案：

// right click
$("#right").click(function(){
    if(now < image_array.length-1){
        now++;
    }
    $('#screen').css('background-image', 'url("' + image_array[now] + '")');alert(now);
});