<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml"  
xmlns:h="http://xmlns.jcp.org/jsf/html"  
xmlns:jsf="http://xmlns.jcp.org/jsf"  
>  
<h:head>  
<title>HTML5-Friendly-markup</title>  
</h:head>  
<h:body>  
<h:form>  
<h:outputLabel for="username" value="User Name "/>  
<h:inputText value="#{user.name}"/><br/>  
<h:outputLabel for="email" value="Email ID "/>  
<input type="email" jsf:id="email" name="email" value="#{user.email}"/><br/><br/>  
<h:commandButton action="result.xhtml" value="submit"/>  
</h:form>  
</h:body>  
</html>

以下是文件：User.java 中的代碼 -

import javax.faces.bean.ManagedBean;  
import javax.faces.bean.RequestScoped;  
@ManagedBean  
@RequestScoped  
public class User {  
    String name;  
    String email;  
    public String getName() {  
    return name;  
    }  
    public void setName(String name) {  
    this.name = name;  
    }  
    public String getEmail() {  
    return email;  
    }  
    public void setEmail(String email) {  
    this.email = email;  
    }  
}

以下是文件：result.xhtml 中的代碼 -

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml"  
xmlns:h="http://xmlns.jcp.org/jsf/html">  
<h:head>  
<title>Response Page</title>  
</h:head>  
<h:body>  
<h1>  
<h:outputText value="Hello #{user.name}"/>  
</h1>  
<h4><h:outputText value="Your email is: #{user.email}" /></h4>  
</h:body>  
</html>

運(yùn)行 Html5FriendlyMarkup 工程，打開(kāi)瀏覽器輸入以下網(wǎng)址：

http://localhost:8084/Html5FriendlyMarkup/

沒(méi)有錯(cuò)誤應(yīng)該會(huì)看到以下界面 -

寫(xiě)入一些簡(jiǎn)單的信息提交，會(huì)看到以下界面 -

使用傳遞屬性

傳遞屬性允許將不屬于JavaServer Faces屬性的屬性傳遞給瀏覽器。如果在JavaServer Faces UI組件中指定傳遞屬性，則屬性名稱和值直接傳遞到瀏覽器，而不被JavaServer Faces組件或渲染器解釋。

您必須將JavaServer Faces命名空間用于傳遞屬性，才能在JavaServer Faces組件中前綴屬性名稱。在下面的示例中，將屬性傳遞給HTML5輸入組件。

傳遞屬性示例

創(chuàng)建一個(gè)名稱為：Html5FriendlyMarkup2 的Web工程，其目錄如下所示 -

以下是文件：index.xhtml 中的代碼 -

<?xml version='1.0' encoding='UTF-8' ?>  
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml"  
      xmlns:h="http://xmlns.jcp.org/jsf/html"  
      xmlns:f="http://xmlns.jcp.org/jsf/core">  
    <h:head>  
        <title>Pass-Through Attributes</title>  
    </h:head>  
    <h:body>  
        <h:form>  
            <h:outputLabel for="username" value="User Name "/>  
            <h:inputText value="#{user.name}">  
                <f:passThroughAttribute name="type" value="text" />  
            </h:inputText><br/>  
            <h:outputLabel for="email" value="Email ID "/>  
            <h:inputText value="#{user.email}">  
                <f:passThroughAttribute name="type" value="email" />  
            </h:inputText><br/><br/>  
            <h:commandButton action="result.xhtml" value="submit"/>  
        </h:form>  
    </h:body>  
</html>

以下是文件：result.xhtml 中的代碼 -

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml"  
      xmlns:h="http://xmlns.jcp.org/jsf/html">  
    <h:head>  
        <title>Response Page</title>  
    </h:head>  
    <h:body>  
        <h1>  
            <h:outputText value="Hello #{user.name}"/>  
        </h1>  
        <h4><h:outputText value="Your email is: #{user.email}" /></h4>  
    </h:body>  
</html>

以下是文件：User.java 中的代碼 -


package com.yiibai;

/**
 *
 * @author Maxsu
 */
import javax.faces.bean.ManagedBean;
import javax.faces.bean.RequestScoped;

@ManagedBean
@RequestScoped
public class User {

    String name;
    String email;

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public String getEmail() {
        return email;
    }

    public void setEmail(String email) {
        this.email = email;
    }
}

運(yùn)行 Html5FriendlyMarkup2 工程，打開(kāi)瀏覽器輸入以下網(wǎng)址：

http://localhost:8084/Html5FriendlyMarkup2/

沒(méi)有錯(cuò)誤應(yīng)該會(huì)看到以下界面 -

寫(xiě)入一些簡(jiǎn)單的信息提交，會(huì)看到以下界面 -

上一篇：JSF <h:commandLink>標(biāo)簽下一篇：JSF <h:inputHidden>標(biāo)簽