如何使用KompoZer添加表单

01之06

用KompoZer添加一个表格

用KompoZer添加一个表格。 屏幕截图Jon Morin提供

在创建网页时,您有很多次需要处理用户提交的输入内容,例如登录页面,创建新帐户或提交问题或评论。 用户输入被收集并使用HTML表单发送到Web服务器。 KompoZer的内置工具可以轻松添加表单。 所有HTML 4.0支持的表单字段类型都可以用KompoZer添加和编辑,但对于本教程,我们将使用文本,文本区域,提交和重置按钮。

02 06

用KompoZer创建一个新窗体

用KompoZer创建一个新窗体。 屏幕截图Jon Morin提供

KompoZer具有丰富的表单工具,您可以使用它将表单添加到您的网页中。 您可以通过单击工具栏上的“表单”按钮或随附的下拉菜单访问表单工具。 请注意,如果您没有编写自己的表单处理脚本 ,则需要从文档或编写脚本的程序员那里获取此步骤的一些信息。 您也可以使用mailto表单,但它们并不总是有效

  1. 将光标置于希望表单出现在页面上的位置。
  2. 单击工具栏上的表单按钮。 窗体属性对话框打开。
  3. 为表单添加一个名称。 该名称用于自动生成的HTML代码中以识别表单并且是必需的。 在添加表单之前,您还需要保存页面。 如果您正在处理新的未保存的页面,KompoZer会提示您保存。
  4. 将URL添加到将在“操作URL”字段中处理表单数据的脚本。 表单处理程序通常是用PHP或类似的服务器端语言编写的脚本。 没有这些信息,您的网页将无法对用户输入的数据进行任何操作。 如果您没有输入,KompoZer会提示您输入表单处理程序的URL。
  5. 选择用于将表单数据提交给服务器的方法。 这两个选择是GET和POST。 您需要知道脚本需要哪种方法。
  6. 单击确定,表单将添加到您的页面。

03年06月

使用KompoZer将文本字段添加到表单中

使用KompoZer将文本字段添加到表单中。 屏幕截图Jon Morin提供

使用KompoZer将表单添加到页面后,表单将以浅蓝色虚线在页面上进行概述。 你在这个区域内添加你的表单域。 您也可以输入文字或添加图像,就像在页面的任何其他部分一样。 文本可用于添加提示或标签以形成指导用户的字段。

  1. 选择要将文本字段放到轮廓表单区域中的位置。 如果您想添加标签,您可能需要先输入文本。
  2. 单击工具栏上“表单”按钮旁边的向下箭头,然后从下拉菜单中选择“表单字段”。
  3. 窗体域属性窗口将打开。 要添加文本字段,请从标有字段类型的下拉菜单中选择文本。
  4. 为文本字段命名。 该名称用于标识HTML代码中的字段,并且表单处理脚本需要名称来处理数据。 通过切换更多属性/更少属性按钮或按下高级编辑按钮,可以在此对话框中修改许多其他可选属性,但现在我们只需输入字段名称即可。
  5. 点击确定,文本框出现在页面上。

04年6月

使用KompoZer将文本区域添加到窗体

使用KompoZer将文本区域添加到窗体。 屏幕截图Jon Morin提供

有时,需要在表单上输入大量文本,例如消息或问题/评论字段。 在这种情况下,文本字段是不恰当的。 您可以使用表单工具添加文本区域表单域。

  1. 将光标定位在希望使用文本区域的表单轮廓中。 如果你想输入一个标签,通常是一个好主意,键入标签文本,按Enter键移动到一个新行,然后添加表单字段,因为页面上的文本区域的大小使它难以理解标签位于左侧或右侧。
  2. 单击工具栏上“表单”按钮旁边的向下箭头,然后从下拉菜单中选择“文本区域”。 文本区域属性窗口将打开。
  3. 输入文字区域的名称。 该名称标识HTML代码中的字段,并由表单处理脚本用于处理用户提交的信息。
  4. 输入您希望文本区域显示的行数和列数。 这些尺寸决定了页面上字段的大小以及在滚动需要发生之前可以输入多少文本。
  5. 可以使用此窗口中的其他控件指定更高级的选项,但现在字段名称和维数已足够。
  6. 单击确定,文本区域出现在窗体上。

05年06月

使用KompoZer将提交和重置按钮添加到表单中

使用KompoZer将提交和重置按钮添加到表单中。 屏幕截图Jon Morin提供

在用户填写完页面上的表单之后,需要用某种方式将信息提交给服务器。 此外,如果用户想要重新开始或出错,那么包含一个控件可以将所有表单值重置为默认值,这很有帮助。 特殊的表单控件处理这些功能,分别称为提交和重置按钮。

  1. 将光标放在您希望提交或重置按钮的轮廓表单区域内。 大多数情况下,这些将位于表单上其余字段的下方。
  2. 单击工具栏上“表单”按钮旁边的向下箭头,然后从下拉菜单中选择“定义按钮”。 按钮属性窗口将出现。
  3. 从标记为类型的下拉菜单中选择按钮的类型。 您的选择是提交,重置和按钮。 在这种情况下,我们将选择提交类型。
  4. 为该按钮命名,该按钮将用于HTML和表单处理代码以处理表单请求。 Web开发人员通常将该字段命名为“提交”。
  5. 在标签为Value的框中,输入应出现在按钮上的文字。 文本应该简短但描述当按钮被按下时会发生什么。 像“提交”,“提交表单”或“发送”就是很好的例子。
  6. 单击确定,该按钮出现在窗体上。

可以使用相同的过程将重置按钮添加到表单中,但从类型字段中选择重置而不是提交。

06年06月

用KompoZer编辑表格

用KompoZer编辑表格。 屏幕截图Jon Morin提供

在KompoZer中编辑表单或表单域非常容易。 只需双击想要编辑的字段,就会出现相应的对话框,您可以在其中更改字段属性以满足您的需求。 上图显示了使用本教程中涵盖的组件的简单表单。