javascript - 当一个 div 完全加载时删除另一个 div

Question

我想在加载 .flexslider div 但 jquery ($('flexslider').load()) 不工作时删除加载图像。如何在div加载完成后移除图片？

index.html

<div class="flexslider">
        <div class="loadingDiv">
            <img src="images/banner0.jpg" style="visibility:hidden"/>
            <div class="showbox">

                <div class="loader">
                    <svg class="circular" viewBox="25 25 50 50">

                        <circle class="path" cx="50" cy="50" r="20" fill="none" stroke-width="2" stroke-miterlimit="10"/>                           
                    </svg>
                </div>
            </div>          
        </div>                                              
            <ul class="slides">
                <li><img src="images/banner1.jpg" width="1000px" height="500px" alt="" class="animated fadeInRightBig">
                    <div class="txtoverlay">
                        <div class="centralise">
                            <div class="verticalwrap">
                            </div>
                        </div>
                    </div>
                </li>
                <li><img src="images/banner2.png" alt="">
                    <div class="txtoverlay">
                        <div class="centralise">
                            <div class="verticalwrap">
                                <article>
                                </article>
                            </div>
                        </div>
                    </div>
                </li>
                <li><img src="images/banner3.png" alt="">
                    <div class="txtoverlay">
                        <div class="centralise">
                            <div class="verticalwrap">
                                <article>
                                </article>
                            </div>
                        </div>
                    </div>
                </li>
                <li><img src="images/banner4.jpg" alt="">
                    <div class="txtoverlay">
                        <div class="centralise">
                            <div class="verticalwrap">
                                <article>
                                </article>
                            </div>
                        </div>
                    </div>
                </li>
                <li><img src="images/banner5.jpg" alt="">
                    <div class="txtoverlay">
                        <div class="centralise">
                            <div class="verticalwrap">
                                <article>
                                </article>
                            </div>
                        </div>
                    </div>
                </li>
                <li><img src="images/banner6.jpg" alt="">
                    <div class="txtoverlay">
                        <div class="centralise">
                            <div class="verticalwrap">
                                <article>
                                </article>
                            </div>
                        </div>
                    </div>
                </li>

            </ul>
        </div>
    </div>

jquery 是:

$(document).ready(function(){

  $('.flexslider').load({
    $('loadingDiv').remove();
  });
});

我认为问题是 $('.flexslider').load() 函数不工作。有没有其他方法可以解决这个问题？

Answer 1

第一个隐藏的元素指定不正确，如果按类取元素需要指定'.'如果您指定类。

其次，在方法“load”中传递的是闭包而不是对象

尝试这样的想法

  $('.flexslider').load(function(){
      $('.loadingDiv').remove();
  });