jQuery 如何通过 h:outputScript 包含 JavaScript 文件?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/9093032/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-27 10:19:31  来源:igfitidea点击:

How to include JavaScript files by h:outputScript?

jqueryjsf-2faceletsjquery-validate

提问by enthusiastic

I want to use jQuery Validate plugin with JSF for client side form validation. I am finding basic difficulty in importing the resources.

我想将 jQuery Validate 插件与 JSF 一起用于客户端表单验证。我发现在导入资源时遇到了基本困难。

In my JSF page I have

在我的 JSF 页面中,我有

<h:outputScript library="js" name="jquery-1.6.2.js"></h:outputScript>
<h:outputScript library="js" name="jquery.validate.js"></h:outputScript>
<h:outputScript library="js" name="jquery.maskedinput.js"></h:outputScript>
<h:outputScript library="js" name="myapp.validate.js"></h:outputScript>

When I click on the script tab in the Firefox, I can't see any script files in the dropdown. There is a message shown:

当我单击 Firefox 中的脚本选项卡时,在下拉列表中看不到任何脚本文件。有一条消息显示:

If tags have a "type" attribute, it should equal "text/javascript" or "application/javascript". Also scripts must be parsable (syntactically correct).

如果标签有一个“type”属性,它应该等于“text/javascript”或“application/javascript”。脚本也必须是可解析的(语法正确)。

Futher my jquery effect like mouse hover, hide, show etc do not work. I tried with usual script tags

此外,我的 jquery 效果如鼠标悬停、隐藏、显示等不起作用。我尝试使用通常的脚本标签

<script type="text/javascript" src="../js/jquery-1.6.2.js"></script>
<script type="text/javascript" src="../js/jquery.validate.js"></script>
<script type="text/javascript" src="../js/jquery.maskedinput.js"></script>
<script type="text/javascript" src="../js/myapp.validate.js"></script>

Which was of no use. Still it was not able to locate my JS files. All my JS files are placed under

这是没有用的。仍然无法找到我的 JS 文件。我所有的JS文件都放在

   Web pages
       |_ js
           |_jquery-1.6.2.js,my.validate.js,jquery.validate.js,jquery.maskedinput.js

I tried one of the solutions posted at Using jQuery with JSF 2.0's resourcebut had no success.

我尝试了使用 jQuery 和 JSF 2.0 的资源发布的解决方案之一,但没有成功。

Kindly suggest me a solution for this. I don't want to use JSF builtin validation with ajax, because we moved the code from JSP to JSF and the validation is already written. I want to reuse the existing jQuery Validation which I previously wrote.

请建议我解决这个问题。我不想在 ajax 中使用 JSF 内置验证,因为我们将代码从 JSP 移动到 JSF,并且验证已经编写。我想重用我之前编写的现有 jQuery 验证。

回答by BalusC

The <h:outputScript>(and <h:outputStylesheet>) loads resources from /resourcesfolder. You need to put the scripts in that folder.

<h:outputScript>(和<h:outputStylesheet>从)加载资源/resources文件夹。您需要将脚本放在该文件夹中。

WebContent
|-- resources
|    `-- js
|        |-- jquery-1.6.2.js
|        |-- myapp.validate.js
|        |-- jquery.validate.js
|        `-- jquery.maskedinput.js
|-- WEB-INF
:

Then the following script declarations should work:

那么下面的脚本声明应该可以工作:

<h:outputScript name="js/jquery-1.6.2.js" />
<h:outputScript name="js/jquery.validate.js" />
<h:outputScript name="js/jquery.maskedinput.js" />
<h:outputScript name="js/myapp.validate.js" />

(note that I omitted the libraryattribute, because the name "js" does not indicate a real library)

(注意我省略了library属性,因为名称“js”并不表示真正的库

That your <script>approach failed is probably caused by using an incorrect relative path. You need to realize that resources are resolved relative to the current request URL and not to their path in the server side disk file system.

您的<script>方法失败可能是由于使用了不正确的相对路径。您需要意识到资源是相对于当前请求 URL 而不是它们在服务器端磁盘文件系统中的路径来解析的。