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

Question

I am wondering how I can make sure the slide loads when the page is opened using this code $('#nav li a').eq(0).click(); 我想知道如何使用此代码$('#nav li a').eq(0).click();打开页面时确保幻灯片加载$('#nav li a').eq(0).click(); I altered the code however it will not run or just load the first image from the slide after I click on the #1. 我更改了代码，但是单击＃1后，它将无法运行或仅从幻灯片中加载第一张图像。 I need it to load the first image when the page is loaded. 加载页面时，我需要它来加载第一个图像。 I thank you all in advance for your help in understanding this. 在此先感谢大家的帮助。

    <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

I'm not 100% sure what you are wanting but if I had to guess I'd say you can simply use .trigger() to fire the click event on any element that has a click bound to it. 我不是100％不确定您想要什么，但是如果我不得不猜测，您可以简单地使用.trigger（）在绑定了单击的任何元素上触发click事件。

$('#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 个解决方案

解决方案1
0 已采纳 2016-02-06 22:49:51

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

问题描述

1 个解决方案

解决方案1 0 已采纳 2016-02-06 22:49:51

解决方案1
0 已采纳 2016-02-06 22:49:51