使用文档就绪语句时 jquery 停止工作

Question

所以我的代码一直运行良好。但是，一旦我放置一个 on document ready 语句，整个脚本就会停止工作。我尝试在文档就绪功能中放置警报，并且它正确通过。

我真的不确定问题是什么，以及我将如何进行调试。任何建议将不胜感激

JS code

$(document).ready(function() {
    $("#sample").effect("transfer", {
        to: $("#{{ $stimuli['sample'][0] }}")
    }, 7000, function() {

      $('#{{$stimuli['sample'][0]}}')
        .append('<a href="response/{{$stimuli['sample'][0]}}"><div class="ui-effects-transfer"></div></a>');

      $('#{{$stimuli['sample'][0]}}').css("border", "10px solid green");
    });

});

一些控制台消息：

    'webkitIndexedDB' is deprecated. Please use 'indexedDB' instead.
firebug-lite.js:15683 'Performance.onwebkitresourcetimingbufferfull' is deprecated. Please use 'Performance.onresourcetimingbufferfull' instead.
http://getfirebug.com/releases/lite/skin/xp/pixel_transparent.gif Failed to load resource: the server responded with a status of 404 (Not Found)
http://localhost:8888/pp/public/public/assets/css/media-queries.css Failed to load resource: the server responded with a status of 404 (Not Found)

新更新遗漏了一些错误。

Failed to load resource: the server responded with a status of 404 (Not Found)
http://localhost:8888/pp/public/task/matching/js/init.js Failed to load resource: the server responded with a status of 404 (Not Found)
http://localhost:8888/pp/public/public/assets/css/media-queries.css Failed to load resource: the server responded with a status of 404 (Not Found)
http://localhost:8888/pp/public/task/matching/js/modernizr.js Failed to load resource: the server responded with a status of 404 (Not Found)
http://localhost:8888/pp/public/task/matching/js/jquery-migrate-1.2.1.min.js Failed to load resource: the server responded with a status of 404 (Not Found)
http://localhost:8888/pp/public/task/matching/js/jquery.flexslider.js Failed to load resource: the server responded with a status of 404 (Not Found)
active:94 Uncaught TypeError: $(...).effect is not a function
firebug-lite.js:11883 Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check http://xhr.spec.whatwg.org/.
chrome-extension://bmagokdooijbeehmkpknfglimnifench/firebug-lite.js Failed to load resource: the server responded with a status of 404 (Not Found)fetchResource @ firebug-lite.js:11884
firebug-lite.js:30396 'window.webkitStorageInfo' is deprecated. Please use 'navigator.webkitTemporaryStorage' or 'navigator.webkitPersistentStorage' instead.
firebug-lite.js:30396 'webkitIndexedDB' is deprecated. Please use 'indexedDB' instead.
firebug-lite.js:15683 'Performance.onwebkitresourcetimingbufferfull' is deprecated. Please use 'Performance.onresourcetimingbufferfull' instead.
http://getfirebug.com/releases/lite/skin/xp/pixel_transparent.gif Failed to load resource: the server responded with a status of 404 (Not Found)
http://localhost:8888/pp/public/public/assets/css/media-queries.css Failed to load resource: the server responded with a status of 404 (Not Found)

Answer 1

如果您的任何 HTML 是动态创建的，您应该使用 .on 而不是标准的 .ready，我不确定这是否会解决您的问题，因为我不是 100% 发生了什么问题，因为您已经提供的信息非常少。

还要确保您的<script src='jquery.js'></script> 位于html 页面的底部。这样可以确保先加载 html，然后再加载 javascript。下面是.on('ready')的示例

$(document).on('ready', function() {
   // Put your code in here
});

编辑：

好的，我想我可能知道您的问题，请确保将您的 JQUERY UI 脚​​本附加到文档 AFTER 您的 JQUERY。例如，它应该看起来像这样：

<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<script src="YOUR_CUSTOM_SCRIPT_.JS"></script> <!-- Put your document.ready function here -->