javascript仅在第一次单击时返回null

我正在制作一个模式，以更大的形式向客户机的观众显示图像。然后向左滑动，然后单击鼠标左键将新图像滑入。当我点击页面上的缩略图时，它会显示在模式中。但是，当我点击第一个模式显示图像时，它返回null，左侧的设置是关闭的。但是，当我点击新的图像时，一切都很好，从那时起，一切都很完美。为什么它返回null，以及如何停止它

代码

控制台日志

HTML

我已经解决了这个问题，我试图在增加索引之前访问“新”图片。谢谢您的帮助。

您是否定义了img_og width initially onload？添加了html，而不是我没有定义img_og onload那么您在什么时候填充了php文件深处的img_index。我用于引用的每个图像都有一个ul。@Cjueden请查看是否可以在a中重现错误，然后在问题中发布链接。

  $( '#modal img').live('click',function(e){
    var index = $(this).attr('img_index');
    var img_og = $( '#viewer ul li img[img_index="' + index + '"] ');
    var imgOgWidth= img_og.width();
    index++;
    if(index > $( '#viewer ul li img').length ) {index = 0;}
    var left = ($( window ).width() - imgOgWidth  )/ 2;
    var src = img_og.attr('src');
    console.log($( window ).width() + " - " + img_og.width() + " = " + left);
    $(this).animate({"left":'-2000px'},300,function(){
        $(this).attr({'src':src,'img_index':index}).css({'width':imgOgWidth,"left":'2000px'}).animate({'left':left},300);
    });
});

1288 - null = 644
1288 - 470 = 409
1288 - 900 = 194
1288 - 900 = 194
1288 - 900 = 194

<div id="modal" class="none">
<img src="" img_index="" />
</div>