Question

我正在使用jquery循环。如果它有多个图像，它可以工作。一张图片不起作用。也没有显示标题。这是一个js fiddle。感谢

具有多个图像的滑块正在工作。

<div id="main">
        <div id="slideshow" class="pics">
            <img src="http://cloud.github.com/downloads/malsup/cycle/beach1.jpg" width="200" height="200" alt="Beach 1" />
            <img src="http://cloud.github.com/downloads/malsup/cycle/beach2.jpg" width="200" height="200" alt="Beach 2" />
            <img src="http://cloud.github.com/downloads/malsup/cycle/beach3.jpg" width="200" height="200" alt="Beach 3" />
            <img src="http://cloud.github.com/downloads/malsup/cycle/beach4.jpg" width="200" height="200" alt="Beach 4" />
            <img src="http://cloud.github.com/downloads/malsup/cycle/beach5.jpg" width="200" height="200" alt="Beach 5" />
            <img src="http://cloud.github.com/downloads/malsup/cycle/beach6.jpg" width="200" height="200" alt="Beach 6" />
            <img src="http://cloud.github.com/downloads/malsup/cycle/beach7.jpg" width="200" height="200" alt="Beach 7" />
            <img src="http://cloud.github.com/downloads/malsup/cycle/beach8.jpg" width="200" height="200" alt="Beach 8" />
        </div>
        <p id="caption"></p>
</div>

Answer 1

你可以在循环调用之前添加它：

if ($("#slideshow img").length == 1) {
    $("#slideshow img").clone().appendTo($("#slideshow"))
}

demo

Answer 2

在不必检查长度的情况下实现此目的的另一种方法是在循环调用之前为第一个图像设置标题：

<强>更新

当img的alt不是实际循环的项目时使用它：

http://jsfiddle.net/lucuma/4Ts3T/7/

$(function() {
    $('#caption').html($('#slideshow img:eq(0)').attr('alt'));
    $('#slideshow').cycle({
        fx:       'fadeZoom',
        timeout:   2000,
        after:     function() {
            $('#caption').html($('img', this).attr('alt')); // get nested img's alt
        }
    });
})

原始答案：

http://jsfiddle.net/lucuma/4Ts3T/2/

$(function() {
    $('#caption').html($('#slideshow img:eq(0)').attr('alt'));
    $('#slideshow').cycle({
        fx:       'fadeZoom',
        timeout:   2000,
        after:     function() {
            $('#caption').html(this.alt);
        }
    });
})

jquery循环不起作用

2 个答案: