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>