带有 JQuery 的 Grails 项目,没有插件

Posted

技术标签:

【中文标题】带有 JQuery 的 Grails 项目,没有插件【英文标题】:Grails project with JQuery without Plugin 【发布时间】:2012-09-28 15:00:43 【问题描述】:

我正在尝试设置一个使用 JQuery 的简单 Grails 2.1.1 应用程序

我有一个名为“TestController”的控制器和一个正确定位的 index.gsp。 我手动添加了 JQuery 库,我没有使用 Grails 插件。我将“jquery-ui-1.8.24.custom.min.js”和“jquery-1.8.0.min.js”放在 web-app/js 中(位置正确,因为我可以看到 Jquery 的代码当我在浏览器中浏览我自己的代码并点击参考链接)

我想运行Autocomplete sample of JQuery。代码如下所示:

<!DOCTYPE html>
<html>
<head>

<script src="../js/jquery-ui-1.8.24.custom.min.js" type="javascript"/>
<script src="../js/jquery-1.8.0.min.js" type="javascript"/>


<script>
    $(document).ready(function () 
        var availableTags = [
            "ActionScript",
            "AppleScript",
            "Asp",
            "BASIC",
            "C",
            "C++",
            "Clojure",
            "COBOL",
            "ColdFusion",
            "Erlang",
            "Fortran",
            "Groovy",
            "Haskell",
            "Java",
            "JavaScript",
            "Lisp",
            "Perl",
            "php",
            "Python",
            "Ruby",
            "Scala",
            "Scheme"
        ];
        $("#tags").autocomplete(
            source:availableTags
        );
    );
</script>

</head>

<body>


<div class="demo">

<div class="ui-widget">
    <label for="tags">Tags: </label>
    <input id="tags">
</div>

</div><!-- End demo -->

到目前为止,自动完成功能不起作用。我错过了什么?

【问题讨论】:

javascript 控制台中的任何错误? $ 未定义。用 JQuery 替换 $ 时相同 尝试将 JS 文件与资源链接 - JQuery 可能没有被加载。 不改变任何东西: 【参考方案1】:

解决了。

确保没有安装 JQuery 插件

JQuery 引用的正确顺序

<script src="../js/jquery-1.8.0.min.js" type="text/javascript"></script>
<script src="../js/jquery-ui-1.8.24.custom.min.js" type="text/javascript"></script>

<script>
    $(document).ready(function () 
        var availableTags = [
            "ActionScript",
            "AppleScript",
            "Asp",
            "BASIC",
            "C",
            "C++",
            "Clojure",
            "COBOL",
            "ColdFusion",
            "Erlang",
            "Fortran",
            "Groovy",
            "Haskell",
            "Java",
            "JavaScript",
            "Lisp",
            "Perl",
            "PHP",
            "Python",
            "Ruby",
            "Scala",
            "Scheme"
        ];
        $("#tags").autocomplete(
            source:availableTags
        );
    );
</script>

【讨论】:

【参考方案2】:

更改对 jQuery 的引用:

<script src="../js/jquery-1.8.0.min.js" type="text/javascript" ></script>
<script src="../js/jquery-ui-1.8.24.custom.min.js" type="text/javascript" ></script>

至少,这在我的计算机上修复了您的示例... :-)

【讨论】:

没有帮助。我还确保未安装 JQuery 插件并且 main.gsp 和根 index.gsp 完全为空。所以只有一个 GSP 有两个引用.... 现在我也收到以下错误:“$("#tags").autocomplete 不是函数”和“jQuery 未定义”,后者链接到 jquery-ui-1.8。 24.custom.min.jsLine: 5 这很奇怪。顺便说一句:您的问题不依赖于 grails - 它只是 grails crates 的 HTML 文件。我把你的例子保存在本地,添加了我的 jquery 文件,上面提到的更改使它工作......你使用的是哪个浏览器?我用 ff 和 ie 测试过。 顺便说一句:自关闭脚本标签有时会导致问题 -> 在 FF 中查看源代码向我展示了这个问题。 与其他页面的比较向我展示了 type="text/javascript" 更改 - 只有当我更改此属性时,它才能在我的机器上运行【参考方案3】:

为什么不使用对资源目录的引用?

<script type="text/javascript" src="$resource(dir:'js',file:'jquery-1.8.0.min.js')"</script>

<script type="text/javascript" src="$resource(dir:'js',file:'jquery-ui-1.8.24.custom.min.js')"> </script>

【讨论】:

【参考方案4】:

您遇到了 Grails 的错误,我花了一段时间才发现。 由于某种原因,第一个 javascript 条目被忽略以进行处理。 要解决您的问题,您需要在资源之前添加一个额外的脚本标签。像这样。

<script type="javascript"/></script>
<script src="../js/jquery-ui-1.8.24.custom.min.js" type="javascript"/>
<script src="../js/jquery-1.8.0.min.js" type="javascript"/>

完成后重新测试.. 它应该被修复。

【讨论】:

?不可能是 grails 中的错误,因为 grails 只是将 HTML 代码传递给执行 javascript 的浏览器。可能是grails自带的模板有问题,但是我从来没有遇到过这个问题。 我知道这是一个问题,但从来没有时间详细说明它发生的原因,但它确实发生了。花了一段时间,从那以后我所有的 gsp 都设置了空白的 javascript 脚本。从那以后再也没有问题了。 我当然不会这样做,也没有任何问题 - 所以至少它不是 grails 2.0.4 及更高版本中的错误 我们使用的是 1.3.7-9 版本,所以它现在可能已经修复了。

以上是关于带有 JQuery 的 Grails 项目,没有插件的主要内容,如果未能解决你的问题,请参考以下文章

Grails 3.1.4带有Swagger文档的项目

使用具有 Jquery 的模板更新视图的 Grails remoteFunction 可以识别模板中的元素

如何在 Grails 中包含 jquery.js?

没有身份验证的 Grails Spring Security 插件访问控制/授权?

TypeError: jQuery(...).dataTable 不是 Grails 中的函数

如何在 Grails 3.0 中使用 jQuery