Question

我想知道如何使用此代码$('#nav li a').eq(0).click();确保在打开页面时加载幻灯片我改变了代码但是它不会运行或者只是在我点击之后加载幻灯片中的第一张图像＃1。我需要它来加载页面时加载第一个图像。我提前感谢你帮助理解这一点。

    <script>

var slideArray = [
"ansel_adams1.jpg",
"ansel_adams2.jpg",
"ansel_adams3.jpg",
"ansel_adams4.jpg",
"ansel_adams5.jpg"
];

$(document).ready(function(){
var slideArray =["ansel_adams1.jpg","ansel_adams2.jpg","ansel_adams3.jpg","ansel_adams4.jpg","ansel_adams5.jpg"];

$('.container').after('<div class="slide-image"></div>');
$('.slide-image').html('<img src="images/'+slideArray[0]+'"/>');
$('.slide-image').after('<ul id="nav"></ul>');
var slideLength = slideArray.length;

for(i=0; i < slideLength; i++){
    var slideText = i + 1;
    $('#nav').append('<li><a href="#" rel="'+slideText+'">'+slideText+'</a></li>');
}


$('#nav li a').bind('click', function(){
    var numSlide = $(this).attr('rel');
    $('.slide-image').html('<img src="images/ansel_adams'+numSlide+'.jpg"/>');
    $('.slide-image img').fadeIn(2000);
    $('#nav li a').removeClass('active');
    $(this).addClass('active');

}); 
});
</script>
<body>
    <div class="container">
      <h1>Working with jQuery Events and Effects Project<//h1>
    </div>   
  </body>
</html>

Answer 1

我不是百分之百确定你想要什么，但如果我不得不猜测我会说你可以简单地使用.trigger()来点击任何绑定了点击的元素上的click事件。 / p>

$('#nav li a').bind('click', function(){
    var numSlide = $(this).attr('rel');
    $('.slide-image').html('<img src="images/ansel_adams'+numSlide+'.jpg"/>');

    // added the complete callback to toggle classes when animation is finished
    $('.slide-image img').fadeIn(2000, function() {
        $('#nav li a').removeClass('active');
        $(this).addClass('active');
    });

}); 

$('#nav li a').eq(0).trigger('click');

如何确保在页面加载jQuery时加载第一张幻灯片？

1 个答案: