在页面设计器中使用列表

可以添加两种类型的列表到一个DHTML页面:一个 List 元素和一个 Select 元素。List 元素是一个滚动列表。Select 元素创建一个组合框,它很象添加到Visual Basic窗体的组合框。

添加项目到HTML列表的工作和添加项目到一个列表框或一个Visual Basic窗体上的组合框的过程差别非常大。不能使用 List 属性或 AddItem 方法添加项目到一个HTML元素,代之,可以使用下面两种方法充填列表:

当在设计器中第一次添加一个列表到一个HTML页面时,列表元素的HTML有如下形式:

元素 当元素被创建时原始的HTML
List
<select name="List1" id="List1" value="List1">
     <option value="List">
</select>
Select
<select name="Select1" id="Select1" value="Select1">
     <option selected value="Select">Select
</select>

注意 如果使用 FrontPage 编辑HTML,可能在上面显示的代码中看到结束</option> 标记。两种用法都是可接受的。

要充填一个列表元素

  1. 从设计器工具栏中单击“执行编辑器”按钮。

  2. 在HTML或文本编辑器中,查看列表元素的源代码。

  3. 复制 <option value="list"> 行,对每一个要添加的列表项目在开始和结束 <select> 标记之间粘贴一次。例如,如果正在添加四个列表项目,在HTML代码中将有四个 <option value="list">。

  4. 在每个 <option> 标记后面输入要添加的列表项目。产生的HTML将有如下的形式:
    <select name="List1" id="List1" value="List1">
    <option value="List">First list item
    <option value="List">Second list item
    <option value="List">Third list item
    </select>
    
  5. 保存更改并返回到设计器。当提示刷新被更改的文件时,单击“确定”。

要充填一个选择的元素

  1. 从设计器工具栏中单击“执行编辑器”按钮。

  2. 在HTML或文本编辑器中,查看列表元素的源HTML代码。

  3. 复制 <option selected value="Select"> 行,对每一个要添加的列表项目在开始和结束 <select> 标记之间粘贴一次。例如,如果正在添加四个列表项目,将有四个 <option selected value="Select">。

  4. 编辑复制的标记,使只有一行是“option selected value="Select”,其它的行应当只是“option value="Select”。例如,如果添加了三行,HTML现在应当有如下形式:
    <select name="Select1" id="Select1" value="Select1">
    <option selected value="Select">Select
    <option value="Select">Select
    <option value="Select">Select
    </select>
    
  5. 在每一个 <option> 标记后面输入要添加的列表项目,替换单词“选择”。产生的HTML将有如下的形式:
    <select name="Select1" id="Select1" value="Select1">
    <option selected value="Select">Default list item
    <option value="Select">Second list item
    <option value="Select">Third list item
    </select>
    
  6. 保存更改并返回到设计器。当提示刷新被更改的文件时,单击“确定”。

在运行时充填一个列表或选择元素

也可以在运行时充填列表元素。例如,假设有一个HTML页面,它包含一个列表、一个文本字段和一个按钮。要最终用户能够在文本字段中输入一个值,然后按一个按钮使该值出现在列表中。下面的图象显示了该HTML页面:

带有列表元素的HTML页面

按钮代码可以使用DHTML Document对象的一个称之为CreateElement的方法来添加列表项目到该列表。该代码应为如下所示:

Private Function Button1_onclick() As Boolean
Dim e as HTMLOptionElement
Set e = Document.createElement("OPTION")
   e.Text=TextField1.Value
   e.Value="ListItemValue"
List1.Options.Add e
End Function

注意 CreateElement方法只可用于Select元素,诸如工具箱中的列表和选择元素,以及IMG元素。不能使用它创建任何其他类型的一个新元素。