0

我创建了一个文件叫做：jquery.js：

$(document).ready(function{
   jQuery('#sortable1, #sortable2')
     .sortable(
     {'connectWith':'.connectedSortable',
     'dropOnEmpty':true,
     'scroll':true,
      items: "li:not(.emptyMessage)",
      receive: function(event, ui) {
             //hide empty message on receiver
             $('li.emptyMessage', this).hide();

             //show empty message on sender if applicable
             if($('li:not(.emptyMessage)', ui.sender).length == 0){
                 $('li.emptyMessage', ui.sender).show();
             } else {
                 $('li.emptyMessage', ui.sender).hide();
             }            
         }

    });
});

在我的index.html.erb，我有：

我添加了第一个脚本 SRC ...：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script>
<script src="assets/jquery.js" type="text/javascript"></script>
<ul id="sortable1" class="connectedSortable">
   <li>List 1-1</li>
   <li>List 1-2</li>
   <li>List 1-3</li>
   <li>List 1-4</li>
   <li class="emptyMessage">This is empty</li>
</ul>

<ul id="sortable2" class="connectedSortable">
  <li>List 2-1</li>
  <li>List 2-2</li>
  <li>List 2-3</li>
  <li>List 2-4</li>
  <li class="emptyMessage">This is empty</li>
</ul>
<div class="clear"></div>

在中console，我得到了下一个错误：

Uncaught SyntaxError: Unexpected token { :3000/assets/jquery.js?body=1:1
Uncaught ReferenceError: jQuery is not defined jquery_ujs.js:429
Uncaught ReferenceError: jQuery is not defined jquery.purr.js:162
Uncaught ReferenceError: jQuery is not defined best_in_place.js:561
Uncaught ReferenceError: jQuery is not defined workers.js:3
Uncaught ReferenceError: $ is not defined application.js:19
Uncaught SyntaxError: Unexpected token {

我认为所有的错误都是因为 jquery.js。

请帮忙。

4

4 回答 4

2

我认为你必须先声明它doc ready

如果您在此脚本之前没有jQuery plugin附加，那么这些修改将不起作用，因此请尝试先包含jQuery此脚本：

And if you use cdn hosted script then page load performance will boostup.

需要注意的一点点修改：

$(document).ready(function{
   //--------------------^----missing braces '()'

它应该是：

$(document).ready(function(){

如果这不能解决，请尝试在此行上方声明

jQuery = $.noConflict();
jQuery(document).ready(function($){

你需要这个订单：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script>

<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js" type="text/javascript"></script>
于 2013-01-08T17:44:52.663 回答
1

您还应该加载完整的 jquery 文件，例如：

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

并且将前两行更改为以下内容也更好一些：

jQuery(document).ready(function ($) {
    $('#sortable1, #sortable2')
于 2013-01-08T17:44:09.037 回答
1

在包含您的 .js 文件之前，在您的 HTML 中包含 jquery

<script src="../../Scripts/jquery-1.8.3.js" type="text/javascript"></script>

然后..

<script src="../../Scripts/jQuery.js" type="text/javascript"></script>
于 2013-01-08T17:44:17.557 回答
1

您需要在页面中实际加载 JQuery 库，然后才能使用它定义的任何内容。如果不加载它，您尝试调用的任何内容都没有在任何地方定义，因此没有什么可调用的。

例如，将以下内容放在任何其他脚本标签之前：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script>

Jai 关于您的语法错误的回答在这方面也是正确的：

Uncaught SyntaxError: Unexpected token { :3000/assets/jquery.js?body=1:1

是由于您在匿名函数声明中的 function 关键字后面没有括号。

声明不带参数的匿名函数的正确方法是：


function () {
  //anonymous function routines/etc in here
}

所以你的第一行需要看起来像：


$(document).ready(function () {

于 2013-01-08T17:45:07.410 回答