Question

嗯，任务是在点击时更改img src。

这样做不是问题。但是我想在改变它时有一些效果。所以，我使用了fadeOut和fadeIn。问题是当img src正在改变img开始＆＃34;闪烁/闪烁＆＃34;。

你可以在这里看到一个例子

http://www.coffee-cult.ru/slidersupreme （右上角的矩形激活滑块按钮）

和代码，

$main_image = $("img").first();

$("#prev_slide").click(function(e) {
    e.preventDefault();
    $main_image.fadeOut(400, function() {
        $main_image.attr('src', images[0]);
    }).fadeIn(400);
});

$("#next_slide").click(function(e) {
    e.preventDefault();
    $main_image.fadeOut(400, function() {
        $main_image.attr('src', images[1]);
    }).fadeIn(400);
});

Answer 1

你可以尝试使用

$(this).attr();

而不是

 $main_image.attr();

Answer 2

它与页面上的其他脚本有关。在这个小提琴中，使用相同的代码看起来很好：http://jsfiddle.net/ewyLcm0s/

var images = ['http://lorempixel.com/100/100/people/1','http://lorempixel.com/100/100/people/2'],
$main_image = $("img").first();

$("#prev_slide").click(function(e) {
    e.preventDefault();
    $main_image.fadeOut(400, function() {
        $(this).attr('src', images[0]).fadeIn(400);
    });
});

$("#next_slide").click(function(e) {
    e.preventDefault();
    $main_image.fadeOut(400, function() {
        $(this).attr('src', images[1]).fadeIn(400);
    });
});

为什么用jQuery更改img src工作不正常？

2 个答案: