JSF - h:commandButton
h:commandButton 标签呈现"submit"类型的 HTML 输入元素。
JSF 标签
<h:commandButton value = "Click Me!" onclick = "alert('Hello World!');" />
渲染输出
<input type = "submit" name = "j_idt10:j_idt13" value = "Click Me!"
onclick = "alert('Hello World!');" />
标签属性
| S.No | 属性与描述 |
|---|---|
| 1 | id 组件的标识符 |
| 2 | rendered 布尔值； false 禁止渲染 |
| 3 | value 组件的值，通常是值绑定 |
| 4 | valueChangeListener 绑定到响应值更改的方法的方法 |
| 5 | coords 形状为矩形、圆形或多边形的元素的坐标 |
| 6 | dir 文本的方向。有效值为 ltr(从左到右)和 rtl(从右到左) |
| 7 | disabled 输入元素或按钮的禁用状态 |
| 8 | tabindex 指定选项卡索引的数值 |
| 9 | target 文档所在的框架的名称已打开 |
| 10 | title 用于可访问性的标题，用于描述元素。可视化浏览器通常会为标题的值创建工具提示 |
| 11 | width 元素的宽度 |
| 12 | onblur 元素失去焦点 |
| 13 | onchange 元素的值发生变化 |
| 14 | onclick 鼠标按钮在元素上单击 |
| 15 | ondblclick 鼠标按钮在元素上双击 |
| 16 | onfocus 元素获得焦点 |
| 17 | onkeydown 按下按键 |
| 18 | onkeypress 按键按下并随后释放 |
| 19 | onkeyup 键被释放 |
| 20 | onmousedown 鼠标按钮在元素上按下 |
| 21 | onmousemove 鼠标移到元素上 |
| 22 | onmouseout 鼠标离开元素区域 |
| 23 | onmouseover 鼠标移到元素上 |
| 24 | onmouseup 鼠标按钮被释放 |
| 25 | onreset 表单已重置 |
| 26 | onselect 在输入字段中选择了文本 |
示例应用程序
让我们创建一个测试 JSF 应用程序来测试上述标记。
| 步骤 | 描述 |
|---|---|
| 1 | 在 com.tutorialspoint.test 包下创建一个名为 helloworld 的项目，如 JSF - 第一个应用程序 一章中所述。 |
| 2 | 按照以下说明修改 home.xhtml。保持其余文件不变。 |
| 3 | 编译并运行应用程序以确保业务逻辑按要求运行。 |
| 4 | 最后，以 war 文件的形式构建应用程序并将其部署在 Apache Tomcat Web 服务器中。 |
| 5 | 按照最后一步中的说明，使用适当的 URL 启动您的 Web 应用程序。 |
home.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">
<head>
<title>JSF Tutorial!</title>
</head>
<body>
<h2>h:commandButton example</h2>
<hr />
<h:form>
<h:commandButton value = "Click Me!" onclick = "alert('Hello World!');" />
</h:form>
</body>
</html>
完成所有更改后，让我们像在 JSF - 第一个应用程序章节中一样编译并运行应用程序。如果您的应用程序一切正常，这将产生以下结果。
jsf_basic_tags.html
