Javascript html页面的加载问题

Javascript html页面的加载问题,javascript,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

这是我的密码:

</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页面在加载时需要花费时间,而页面挂起而不让其他页面加载?当我单击一个按钮时,加载它是没有问题的,但只要我单击另一个按钮,一个页面就会挂起,或者它不会加载,并且加载需要时间。

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

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

可以从index.js添加代码吗?这可能会有所帮助。首先,只加载一个版本的jQueryThat的大量代码供我们调试。请提供一个示例,在制作SSCCE时,您可能会看到它开始工作,因为您删除了jQuery包含的4个版本中的3个(!!!)。为什么要加载四个版本的jQuery和两个版本的jQuery UI?此外,您可能不需要引导文档JS。