jsf 中使用jquery应注意事项

It will just work the same way. However, you need to take care of several things such as:

1/ JSF will append form's ID to all input inside the form. Hence, you need to be careful with your jQuery selectors. For example, suppose you have the following form:

<h:formid="myForm"><h:inputTextid="myInput"/></h:form>

Using jQuery, you have to refer to the input as: $("myForm\\:myInput")

2/ If you also use some frameworks such as PrimeFaces, some components may not work or may lost their skinning if you import your jQuery with:

<scripttype="text/javascript"src="js/jquery-1.7.1.js"></script>

Instead, you should use their built-in jQuery library by importing as:

<h:outputScriptlibrary="primefaces"name="jquery/jquery.js"target="head"/>

This jQuery library is, however, included in conflict mode which means you cannot use $(). Hence, you may need this additional setting:

<h:outputScripttarget="head">
    $ = jQuery;
    // Then you can use it
    $(document).ready(function() {
        ...
    });
</h:outputScript>

相关推荐