Javascript 删除Jquery bxslider中的幻灯片

即时通讯，试图删除第一张幻灯片后，才循环回来，我也想不让寻呼机为该幻灯片的整个时间可见。我尝试了onBeforeSlide回调，以便它可以动态运行，然后在更新更改后调用slider.reloadSlider（）。我还尝试手动调用slider.redrawsslider（），但没有成功

问题是，当我调用第一个元素上的$（element）.remove（）时，它会冻结，当我调用slider.reloadSlider（）时，它也会冻结。任何帮助都将不胜感激。我的代码如下

!！HTML

<div id="landing-slider">
    <ul class="bxslider">
        <li id="first-image">
          <img class="slide-img" id="img0" src="/landing-page/S1.2.png" alt="Landing     Opening TV Image"/>
        </li>

        <li>
            <img class="slide-img" id="img1" src="/landing-page/0.png"  alt="slide image 1"/>

            <div style="font-size:16px; padding:0px 40px;">
                <p><b>1. Just enter your first name.</b></p>

                <p>Just type your first name into the box on the left this page.</p>
            </div>
        </li>

        <li>
            <img class="slide-img"  id="img2" src="/landing-page/1.png" alt="slide image 2"/>
            <div style="font-size:16px; padding:0px 40px;">
                <p><b>2. Select your best option.</b></p>

                <p>Simply select the best option for you based on your situation and what you want to
                    accomplish.</p>
            </div>
        </li>
        <li>
            <img class="slide-img"  id="img3" src="/landing-page/2.png" alt="slide image 3"/>

            <div style="font-size:16px; padding:0px 40px;">
                <p><b>3. Zoom throughout the process.</b></p>

                <p>Breeze through the simple, fun and exciting steps (and skip anything that isn't relevant to
                    you).</p>
            </div>
        </li>
        <li>
            <img class="slide-img"  id="img4" src="/landing-page/3.png" alt="slide image 4"/>

            <div style="font-size:16px; padding:0px 40px;">
                <p><b>4. Get your personal results.</b></p>

                <p>In just minutes get complete and easy access to the best options (you may never otherwise even
                    know about) and much, much more...</p>
            </div>
        </li>
    </ul>
 </div>

---

有点淫秽，但可能类似（假设您的暂停时间如上所述为1500，将超时时间设置为第一张幻灯片刚完成时）

---

将其放置在

$（document）.ready（function（）{

中的任意位置，但不在

bxslider（）中

bit

找到了答案，答案是我的回调没有重置滑块的设置，因此它被设置为默认值，滑块停止自动转换。我创建了一个设置对象，并在删除第一张幻灯片后用这些设置重新加载它

       var timeBetweenSlides = 4000;
       var timeToChangeSlide = 500;
       var landingSliderSettings = {
           startSlide: 0,
           speed: timeToChangeSlide,
           pause: timeBetweenSlides,
           pager: true,
           auto: true,
           autoControls: true,
           onSlideAfter: function() {
               $('.bx-start').trigger('click');
           },
           onSlideBefore: function($elment, oldIndex, newIndex){
               if($elment.is($("#first-image"))){
                   $("#first-image").remove();
                   landingSlider.reloadSlider(landingSliderSettings);
               }
           }
       }
       var landingSlider = $('.bxslider').bxSlider(landingSliderSettings);

---

我向您推荐，它提供了动态删除幻灯片的功能？非常好，谢谢！为什么在bxslider回调中不起作用？是什么让它变得淫秽？渴望学习：）：）你有JSFIDLE吗？请回答@Josh.s comment.fantacious的问题。完全不知道它为什么失败。只是一个平底船真的。没有。这是一个经过大量修改的CSS的巨大混乱，我似乎已经让它工作了，不过谢谢@franciscocorralesocense，因为它没有处理插件的本机功能，只是一个懒惰的回答，可能会大多数人肯定成功了：）

setTimeout(function(){
    $('#first-image').remove();
},2000);

       var timeBetweenSlides = 4000;
       var timeToChangeSlide = 500;
       var landingSliderSettings = {
           startSlide: 0,
           speed: timeToChangeSlide,
           pause: timeBetweenSlides,
           pager: true,
           auto: true,
           autoControls: true,
           onSlideAfter: function() {
               $('.bx-start').trigger('click');
           },
           onSlideBefore: function($elment, oldIndex, newIndex){
               if($elment.is($("#first-image"))){
                   $("#first-image").remove();
                   landingSlider.reloadSlider(landingSliderSettings);
               }
           }
       }
       var landingSlider = $('.bxslider').bxSlider(landingSliderSettings);