Why Object在jquery中预期错误

Why Object expected error in jquery?

本文关键字：错误 jquery Object Why      更新时间：2023-09-26

我有一个简单的网页，包含html、css和jquery。这个页面的目的是演示水平折叠窗格。

<html>
<head>
    <script type="text/javascript" src="//code.jquery.com/jquery-1.10.1.js"></script>
    <title>Sample HTML</title>
    <style type="text/css">
        html, body {
            width: 100%;
            height: 100%;
        }
        #map {
            width: 10%;
            height: 100%;
            float: left;
        }
        #sidebar {
            width: 89%;
            height: 100%;
            float: left;
            border: 1px solid;
        }
        #toggle {
            height: 10%;
            float: right;
        }
    </style>
    <script type="text/javascript">
        $(window).load(function () {//this is error line
            $(document).ready(function () {
                $("#toggle").click(function () {
                    if ($(this).data('name') == 'show') {
                        $("#sidebar").animate({
                            width: '10%'
                        }).hide()
                        $("#map").animate({
                            width: '89%'
                        });
                        $(this).data('name', 'hide')
                    } else {
                        $("#sidebar").animate({
                            width: '89%'
                        }).show()
                        $("#map").animate({
                            width: '10%'
                        });
                        $(this).data('name', 'show')
                    }
                });
            });
        });
    </script>

    </head>
<body>
    <div id="map">
        <input type="button" data-name="show" value="Toggle" id="toggle"></div>
    <div id="sidebar">SIDEBAR</div>
</body>
</html>

我使用了IE调试器，它在$(window).load(function ()上显示预期对象。我不明白为什么它不起作用。

此外，加载此页面需要很长时间。

您不需要使用$(window).load(function () {，因为$(document).ready是存在的，因为当DOM就绪时document.ready会激发，而当加载图像或任何其他资源时window.load会激发。有关详细信息，请参阅此。

您的错误是因为jquery库路径不正确，所以请再次检查以下路径

<script type="text/javascript" src="//code.jquery.com/jquery-1.10.1.js"></script>

我认为应该从http:// 开始

<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.1.js"></script>

您可以在更正lib路径后删除window.load，它应该可以工作。

<script type="text/javascript">
            $(document).ready(function () {
                $("#toggle").click(function () {
                    if ($(this).data('name') == 'show') {
                        $("#sidebar").animate({
                            width: '10%'
                        }).hide()
                        $("#map").animate({
                            width: '89%'
                        });
                        $(this).data('name', 'hide')
                    } else {
                        $("#sidebar").animate({
                            width: '89%'
                        }).show()
                        $("#map").animate({
                            width: '10%'
                        });
                        $(this).data('name', 'show')
                    }
                });
            });
    </script>
相关文章：