1

每次单击列表项后我尝试使用它时，它都会返回-1。有人可以启发我吗？我将不胜感激：/谢谢。这是我一直在做的，需要创建一个带有缩略图的图像滑块。

function create_thumbs() {
    imagesUl.children('li').each(function() {
        $('<li class="thumbs"><img src="images/thumb.png" alt="thumb"/></li>').addClass('thumb').hide().appendTo('ul#thumbs').fadeIn(300)
        .click(function() {
            goToSlide();
            return false;
        });
    });
}

这是为幻灯片中的每个图像创建缩略图的功能。下面是我将创建的函数的开始，以便在单击拇指后转到相应的图像。

function goToSlide() {
    var thumbClicked = $(this);
    alert(thumbClicked.parent('ul#thumbs').index());
}

警报始终返回 -1。我尝试了几种方法。可能是什么问题呢 ？

由于有人要求一些 html，这就是唯一重要的问题：

<div id="slider">
                    <ul id="images">
                        <li><img src="images/slideshow/1.jpg" alt="1" title="1"/></li>
                        <li><img src="images/slideshow/2.jpg" alt="2" title="2"/></li>
                        <li><img src="images/slideshow/3.jpg" alt="3" title="3"/></li>
                    </ul>
                    <ul id="thumbs">

                    </ul>
                </div>
4

2 回答 2

4

thisgoToSlide 函数中是全局范围，window. 您可以使用以下方式显式设置执行上下文call：

goToSlide.call(this);

或者，您可以将单击的元素作为参数传递：

goToSlide(this);
....
function goToSlide(thumbClicked){
    alert(thumbClicked.parent('ul#thumbs').index());
}
于 2013-01-07T18:38:43.413 回答
1

始终尝试将最低版本发布到http://jsfiddle.net/，以便我们更轻松地为您提供帮助。另请阅读http://dailyjs.com/2012/06/25/this-binding/

尝试这个

function create_thumbs() {
    imagesUl.children('li').each(function() {
        $('<li class="thumbs"><img src="images/thumb.png" alt="thumb"/></li>').addClass('thumb').hide().appendTo('ul#thumbs').fadeIn(300)
        .click(function() {
            goToSlide($(this));
            return false;
        });
    });
}

function goToSlide(thumbClicked) {
    alert(thumbClicked.parent('ul#thumbs').index());
}
于 2013-01-07T18:42:36.037 回答