如何将占位符属性添加到 JSF 输入组件？
Posted
技术标签:
【中文标题】如何将占位符属性添加到 JSF 输入组件？【英文标题】：How to add placeholder attribute to JSF input component? 【发布时间】：2012-01-19 14:59:14 【问题描述】：这行代码不应该在使用 html5 时呈现一个带有占位符文本“填充我”的 inputtext 字段吗？
<h:inputText placeholder="fill me" />
我没有看到任何占位符文本。我以为所有不是 JSF 的东西都被传递给浏览器进行渲染？
【问题讨论】：
您必须使用该标签支持的属性之一。或者您可以制作自己的自定义组件（或复合组件）来支持该属性。您可以在此处查看有效属性列表：docs.oracle.com/javaee/6/javaserverfaces/2.1/docs/vdldocs/… @gurung：如果标准组件/渲染器已经不支持它，那么复合是不可能的。另见***.com/questions/6822000/… @BalusC：哦，是的，我什至没有想到它会是同一个组件，即使在复合合成中也会使用。再次感谢您的提醒。 【参考方案1】：我以为所有不是 JSF 的东西都被传递到浏览器进行渲染？
因此这个假设是错误的。 Unspecified 组件属性被 JSF 渲染器忽略。
您基本上有以下选择来让它工作：
如果您已经使用 JSF 2.2 或更高版本，请将其设置为 passthrough attribute。
<... xmlns:a="http://xmlns.jcp.org/jsf/passthrough">
<h:inputText a:placeholder="fill me" />
请注意，我使用 XML 命名空间前缀 a（“属性”）而不是教程中所示的 p，否则它会与 PrimeFaces 的默认 XML 命名空间前缀 p 发生冲突。
为<h:inputText> 实现一个自定义渲染器，您可以在其中显式检查和写入属性。
实现一个使用上述自定义渲染器的自定义组件。
实现一个基于 JS 的解决方案，您可以从 DOM 中获取元素并显式设置属性。
寻找支持此功能的组件库。例如，PrimeFaces 有一个 <p:watermark> 用于此目的，并为不支持输入的 placeholder 属性的浏览器提供基于 JS 的优雅降级。
另见：
Custom HTML tag attributes are not rendered by JSF【讨论】：
an implementaion for option one gtk，我们使用的是 myfaces，所以我最终继承了 org.apache.myfaces.renderkit.html.HtmlTextRenderer @Sam：这不是 JSF impl 特有的。 我们使用的是 JSF 1.2，看起来需要 2.0，所以我必须自己编写。如果我们升级，那么我一定会切换到它。 这里是使用 JSF 2.2，您可以像这样传递未指定的属性：
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:p="http://xmlns.jcp.org/jsf/passthrough"
>
<h:inputText p:placeholder="fill me"></h:inputText>
【讨论】：
在 JSF 2.3 Eclipse 中说：当我使用 xmlns:p="xmlns.jcp.org/jsf/passthrough"时找不到 uri 的 facelet 标记库【参考方案3】：如果使用 Primefaces 和 JSF 2.0+，您可以使用 placeholder 属性或 p:watermark 来实现它，或者当 JSF 2.2 可用时，您可以使用 pt:placeholder 属性。
Primefaces
<p:inputText id="search_input_id" value="#watermarkBean.keyword"
required="true" label="Keyword" placeholder="fill me" />
旧版浏览器支持（添加 JS 解决方案）：
<p:inputText id="search_input_id" value="#watermarkBean.keyword"
required="true" label="Keyword" />
<p:watermark for="search_input_id" value="fill me" />
JSF 2.2（无 PF）
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:pt="http://xmlns.jcp.org/jsf/passthrough">
<h:head>
</h:head>
<h:body>
<h:inputText value="#bean.value" pt:placeholder="fill me"/>
</h:body>
</html>
这基本上会生成一个 HTML 5
<input placeholder="fill me" />
查看this的答案。
【讨论】：
【参考方案4】：如果您使用的是 RichFaces，从 4.3 版开始，您可以为此使用标签“rich:placeholder”，如 here 所示。基本上：
<h:inputText id="myInput">
<rich:placeholder value="My placeholder text"></rich:placeholder>
</h:inputText>
【讨论】：
【参考方案5】：使用 primeface 4.0。此版本以下的版本不支持占位符属性。
使用名称空间xmlns:pt="http://java.sun.com/jsf/passthrough"。
p:inputTextarea id="textAreaValue" pt:placeholder="your text"
不要在inputTextArea 中插入新行。
【讨论】：
placeholder 属性与 JSF 版本有关，与 PF 版本无关。【参考方案6】：
正如 BaluSc 所说，这是非常简单且独立于浏览器的代码，
在 primefaces 中，使用 p:watermark 来获得所需的功能。
官方Demo是HERE
【讨论】：
【参考方案7】：
<h:head>
</h:head>
<h:body>
<h:inputText value="#bean.value" placeholder="fill me"/>
</h:body>
这很适合我，试试吧！
【讨论】：
使用占位符文本呈现输入字段的最简单方法是使用基本输入标记
例子：
<input type="text" placeholder="Fill me" value="#EL"/>
注意：您不必包含任何命名空间
【讨论】：
【参考方案9】：试试这个
<h:inputText id="name" value="#login.userId" class="aux1" />
<h:inputSecret id="password" value="#login.password" redisplay="true" class="aux2" autocomplete="off" />
<script>
$('.aux1').attr('placeholder', 'Introducir Usuario');
$('.aux2').attr('placeholder', 'Introducir Contraseña');
</script>
使用 jQuery，这很适合我。
【讨论】：
以上是关于如何将占位符属性添加到 JSF 输入组件？的主要内容，如果未能解决你的问题，请参考以下文章
将 HTML5 占位符属性添加到 Spring 3.0 表单输入元素