2

我和我相信许多其他开发人员都习惯于在 then<head>标记或视图页面中的 '' 标记中编写更小的内联脚本块。现在我的头看起来像这样,

<head>
    <title>Simple Demo</title>
    <script>
        function setCheckCheckboxState(checkbox, state) {

        }

        $(function() {

            $("#tri-state").prop("indeterminate", true);
        });
    </script>
</head>

尽管代码由于某种原因运行良好,但在 Chrome 开发人员控制台中,就在$(function()调用上方,我得到了错误Uncaught ReferenceError: $ is not defined

现在我不喜欢在尝试调试该代码时看到与我的代码无关的错误,因此我已将其移至@Scripts.Render("~/bundles/jquery")标签<head>中。当我们都可以访问一个几乎本能的函数时,为什么 MS 要将它移到正文之后,我们使用该函数仅在整个文档加载后才调用任何 jQuery 代码?

4

2 回答 2

2

主要是为了性能。请参阅: jQuery Script included at the bottom of page in mvc 4 template

于 2013-03-03T09:27:40.850 回答
1

必须在使用 jQuery的jQuery任何函数之前声明脚本。

需要在 jQuery 脚本引用之后调用此代码以解决Uncaught Reference您遇到的错误。

$(function(){...});

根据最佳实践(由Yahoo!和许多其他人完成),脚本被添加到</body>标签末尾之前,这就是 MS 选择这种方法的原因。从技术上讲,文档准备功能$(function(){});应该不是必需的,因为脚本已经在页面底部,即在 UI 元素加载到 DOM 之后。最好始终将其仅用于安全措施。

<body>
   <div id="content"></div>
   @Scripts.Render("~/bundles/jquery")
   <script type="text/javascript">
       $(function() {
           ....
       });
   </script>
</body>
于 2013-03-03T06:53:52.300 回答