加载html页面的问题

时间:2014-02-05 09:43:19

标签: javascript

这是我的代码:

</html>
    <body background="images/top_bannercroppppp.jpg">
        <div class="navbar navbar-inverse navbar-fixed-top" role="navigation" id="topbar">
            <div class="container-fluid">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <label id="toplabel" style="color:#FFFFFF"></label>
                </div>
                <div class="navbar-collapse collapse">
                    <ul class="nav navbar-nav navbar-right">
                        <li>
                            <a href="#">
                                <img src="images/btn_logout.jpg">
                            </a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="container-fluid">
            <div class="row">
                <div class="col-sm-3 col-md-2 sidebar" id="menu">
                    <div id="divRows">
                        <ul class="nav nav-sidebar" id="ul_list">
                            <li id="divlist" class="active">
                                <img src="images/camera_Off.png" width="150" id="liveVideo" style="margin-left:10%" onclick="playon1()" alt="Camera" />
                            </li>
                            <br/>
                            <li>
                                <img src="images/users_Off.png" id="users" width="150" style="margin-left:10%" alt="Users" onclick="playon2()" />
                            </li>
                            <br/>
                            <li>
                                <img src="images/settings_Off.png" id="settings" width="150" style="margin-left:10%" alt="Settings" onClick="playon3()" />
                            </li>
                            <div id="ulsettings">
                                <ul id="list">
                                    <li> <a href="#" id="videopg">Video</a>
                                    </li>
                                    <li> <a href="#" id="adv_features">Advanced Features</a>
                                    </li>
                                    <li> <a href="#" id="camera">Camera</a>
                                    </li>
                                    <li> <a href="#" id="audio">Audio</a>
                                    </li>
                                    <li> <a href="#" id="Date_Time">Date/Time</a>
                                    </li>
                                    <li> <a href="#" id="NetworkPort">Network and Port</a>
                                    </li>
                                    <li> <a href="#" id="alarm">Alarm</a>
                                    </li>
                                    <li> <a href="#" id="storage">Storage</a>
                                    </li>
                                </ul>
                            </div>
                            <li>
                                <img src="images/maintanance_off.png" id="maintenance" width="150" style="margin-left:10%" alt="Maintenance" onClick="playon4()" />
                            </li>
                            <br/>
                            <li>
                                <img src="images/support_off.png" id="support" width="150" style="margin-left:10%" alt="Support" onClick="playon5()" />
                            </li>
                            <br/>
                        </ul>
                        <img src="images/logo.jpg" id="logo" />
                    </div>
                </div>
                <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main" id="topbanner"></div>
            </div>
        </div>
        </div>
        <!-- Bootstrap core JavaScript
        ================================================== -->
        <!-- Placed at the end of the document so the pages load faster -->
        <script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
        <script src="bootstrap-3.1.0/docs/dist/js/bootstrap.min.js"></script>
        <script src="bootstrap-3.1.0/docs/assets/js/docs.min.js"></script>
        <script src="js/index.js"></script>
        <script src="js/jquery/jquery-1.10.2.js"></script>
        <script src="js/jquery/jquery-1.8.3.min.js"></script>
        <script src="js/jquery/jquery-ui-1.9.2.custom.min.js"></script>
        <script src="js/jquery/jquery.base64.js"></script>
        <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
        <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
    </body>
</html>

为什么HTML页面在加载时需要花费时间,页面会在不加载其他页面的情况下消失?当我点击一个按钮时,加载它没有问题,但是一旦我点击另一个页面就会挂起或者它不会加载并且需要花费时间加载它。

1 个答案:

答案 0 :(得分:3)

您正在多次从不同位置加载相同的库。例如:

js/jquery/jquery-1.10.2.js
http://code.jquery.com/jquery-1.9.1.js
https://code.jquery.com/jquery-1.10.2.min.js