WML教程(10-15)

WML教程10：分组选择控件（Optgroup）和复杂实例

相关option分组产生层级，对最终用户来说可能没有什么意义，但是对于制作者来说，option分组可以提供很多方便。

相关属性:

1. title 标题，通常这种标题无法被显示

示例：

<card>
<p> what os you use now？
　<select name="os">
　　<optgroup title="microsoft">
　　　<option value="dos">dos</option>
　　　<option value="windows">windows</option>
　　</optgroup>
　　<optgroup title="others">
　　　<option value="unix">unix</option>
　　　<option value="linux">linux</option>
　　</optgroup>
　</select>
</p>
</card>

上例演示了一个基本的optgroup元素的应用，由于optgroup没有变量参数，所以只能提供有限的应用。

一个比较复杂的例子：

<?xml version="1.0"?>
<!doctype wml public "-//wapforum//dtd wml 1.1//en" "http://www.wapforum.org/dtd/wml_1.1.xml">
<wml>

<template>
　　<do type="options" label="back">
　　　　<prev/>
　　</do>
</template>

<card id="lists">
<p>
<select title="pick lists">
　　<option onpick="#jy">jin yong</option>
　　<option onpick="#gl">gu long</option>
</select>
</p>
</card>

<card id="jy">
<onevent type="onenterbackward">
　　<prev/>
</onevent>
<do type="accept">
　　<go href="#display_fav"/>
</do>
<p> pick your fav book:
<select name="fav" title="stooges">
　　<option value="xiao">xiao ao jiang hu</option>
　　<option value="she">she diao ying xiong</option>
　　<option value="lu">lu ding ji</option>
　　<option value="shen">shen diao xia lv</option>
</select>
</p>
</card>

<card id="gl">
<onevent type="onenterbackward">
　　<prev/>
</onevent>
<do type="accept">
　　<go href="#display_fav"/>
</do>
<p> pick your fav book.
<select multiple="true" title="gu long" name="fav" >
　　<option value="gu">gu xing zhuan</option>
　　<option value="da">da di fei ying</option>
　　<option value="tian">tian ya ming yue dao</option>
　　<option value="feng">lu xiao feng</option>
</select>
</p>
</card>

<card id="display_fav">
<p> your fav was $fav. </p>
</card>
</wml>

WML教程11：文本框控件（Input）

 

<input name="name" title="title" type="type" value="value" format="specifier" emptyok="false|true" size="n" maxlength="n" tabindex="n"/>

　　用来输入文本，除了name属性是必要的，其他参数可选。

相关属性:

　　title，该输入框的标题。
　　type，默认值为text，如选择password，则输入的数据显示为*。
　　name，指定了用来存储该输入文本的变量名字。
　　value，与select的相同属性很相似，name用于存储变量数据，value用于提供缺省值。
　　format，用来格式化输入的数据，可用的标记如下，使用时可用“一位数字标记”和“*标记”的形式，前者代表n个标记型字符，如3x，后者代表任意个(小于maxlength属性的值)标记型字符。

　　标记　描述

　　a 　　任何符号或者大写字母(不包括数字)
　　a 　　任何符号或者小写字母(不包括数字)
　　n 　　任何数字(不包括符号或者字母)
　　x 　　任何符号、数字或者大写字母(不可改变为小写字母)
　　x 　　任何符号、数字或者小写字母(不可改变为大写字母)
　　m 　　任何符号、数字或者大写字母(可改变为小写字母)或者多个字符，默认为首字大写
　　m 　　任何符号、数字或者小写字母(可改变为大写字母)或者多个字符，默认为首字小写

　　maxlength属性，指定了用户可输入的最大字符长度，最大限制为256个字符。
　　emptyok属性，表示用户可否不填输入框，默认为false，即要填。
　　size属性，输入框显示长度，目前未被支持。
　　tabindex属性，类似于在html表单中按tab键后，焦点落在哪个选项上，该值决定了这个选择顺序，数字大的排在后面。目前未被支持。

示例：

<card>
<p>
　first name:
　　 <input type="text" name="first"/><br/>
　last name:
　　 <input type="text" name="last"/><br/>
　age:
　　 <input type="text" name="age" format="3n"/>
</p>
</card>

WML教程12：控件组（Fieldset）和复杂示例

fieldset 提供了一种控件分组的功能，相对于optgroup它的潜在价值更强了，但是需要客户端设备的支持才能获得显示效果。

　　相关属性:

　　title 标题

　　综合示例：

<?xml version="1.0"?>
<!doctype wml public "-//wapforum//dtd wml 1.1//en" "http://www.wapforum.org/dtd/wml_1.1.xml">
<wml>

<template>
　　<do type="options" label="back">
　　　　<prev/>
　　</do>
</template>

<card id="fields">
<p> field type:
　<select title="field type">
　　<option onpick="#nested">nested</option>
　　<option onpick="#password">password</option>
　</select>
</p>
</card>

<card id="nested">
<onevent type="onenterbackward">
　　<prev/>
</onevent>
<do type="accept" label="done">
　　<go href="#done"/>
</do>
<p>
<fieldset title="name">
　　first name:
　　　 <input title="first" name="fname"/>
　　last name:
　　　 <input title="last" name="lname"/>
</fieldset>
gender:
<select title="gender" name="gender">
　　<option value="male">male</option>
　　<option value="female">female</option>
</select>
</p>
</card>

<card id="done">
<p> $fname $lname is a $gender. </p>
</card>

<card id="password">
<onevent type="onenterbackward">
　　<prev/>
</onevent>
<do type="accept" label="done">
　　<go href="#passwd_done"/>
</do>
<p> input a password:<br/>
min 3 chars.
<input title="password" name="passwd" type="password" format="*m"/>
</p>
</card>

<card id="passwd_done">
　　<p> password was $passwd. </p>
</card>
</wml>

WML教程13：计时器（timer）

timer可以用来在用户不进行任何操作的一段时间后，自动执行一个任务，任何激活card页面的任务和用户操作都会启动timer，而任务进行时，timer就停止。每个card只能有一个timer，一个timer只能触发一个任务。语法如下：<timer value="value"/>，value为必选属性，用来设置定时器的定时值，最小单位为0.1秒。

　　相关属性:

　　value 倒计时的点数，每一单位等于0.1秒。

示例：

<?xml version="1.0"?>
<!doctype wml public "-//wapforum//dtd wml 1.1//en" "http://www.wapforum.org/dtd/wml_1.1.xml">
<wml>

<card id="first" ontimer="#next">
　<timer value="100"/>
<p>wait ten seconds</p>
</card>

<card id="next">
<onevent type="timer">
　　<go href="#first"/>
</onevent>
<timer value="10"/>
<p>wait one second</p>
</card>
</wml>

WML教程14：WML 文本处理

wml使用xml文档字符集，目前支持unicode 2.0，和hdml不同，wml的所有标签，属性和规定的可接收值必须小写，card的名字和变量也是区分大小写的。和hdml一样，对于连续的空字符，只显示一个空格。标签内属性的值必须用"或者'括起来，属性名，＝和值之间不能有空格。对于不成对出现的标签，必须在 > 前加 / ，比如<br/>。

保留字符

在对保留字符的处理上也基本相同，对应的取代字符有：

　　< &lt;
　　> &gt;
　　' &apos;
　　" &quot;
　　& &amp;
　　$ $$
　　空格 &nbsp;
　　- &shy;

这里要指出的是在url的传递过程中，用来连接参数的 & 必须转化为 & 。

空白处理

wml处理空白内容的方法继承于xml，浏览器会主动忽略所有无意义的空格和属性，连续的空格也会被压缩处理。

文字处理功能

wml也提供了一些字符处理功能，不过并非所有手机都支持这些功能。
<em> 强调
<strong> 加重
<i> 斜体字
<b> 黑体字
<u> 下划线
<big> 字体加大一号
<small> 字体减小一号

浏览器处理文字链接时通常会自动套用<em>或<strong>功能，但是<i><b><u>必须专门调用，否则不会在任何情况下缺省使用。

段落

wml提供两种段落方式wrap或者nowrap，当我们选择了nowrap的时候，我们必须确认客户端设备具有阅读不折行长信息的功能，手机通常是具备这种功能的，而且不同的手机处理方式不一样。

<p align="left | center | right" mode="wrap | nowrap">

强行断行

<br/>
一定要加一条斜线在后面。在表单中如果有多个<input>或者<select>，其间不要用<br/>。由于wml的链接是菜单模式的，所以多个连续的链接也不需要加<br/>。

WML教程15：表格和图形

由于浏览终端的限制，wml无法也没有必要提供复杂的表格功能

1、基本属性（table）

相关属性：

title 表格的标题
align 为表格内的文本和图片设置水平对齐方式，c=center l=left r=right，缺省参数为l
columns 表格列数目，当该变量设置为0时会发生错误。

2、表格行（tr）

tr用来声明一行表格，wml允许空白行的存在，而且空白行不会被浏览器忽略。

3、表格列（td）

td元素声明表格中的一个单元格，单元格可以为空白，而且空白单元格不会被浏览器忽。浏览器可以处理多行文本的单元格，单元格分行可以用<img>或<br/>标签。

nokia 7110不支持多列表格，所以表格应用在一定程度上受到限制。

示例：

<?xml version="1.0"?>
<!doctype wml public "-//wapforum//dtd wml 1.1//en" "http://www.wapforum.org/dtd/wml_1.1.xml">
<wml>

<card>
<p>
　<table columns="2">
　　<tr><td>one</td><td>two</td></tr>
　　<tr><td>1</td></tr>
　　<tr><td>b</td><td>c<br/>d</td></tr>
　</table>
</p>
</card>
</wml>

图形

　　wml提供1位黑白bmp图片的操作，标签类似于html，<img alt="text" src="url" localsrc="icon" align="left" height="n" width="n" vspace="n" hspace="n"/>，属性中alt和src是必须要有的，其他可选。另外要注意的是<img>要放在<p>里，不能放在<do>和<option>等功能健标签和选单标签里。

　　alt属性用来指定当手机不支持图片显示时用来显示的文字。
　　src属性指定图片的url，但当有了以下的localsrc属性时，手机浏览器就忽略src属性。
　　localsrc属性用来指定显示存在手机rom中的图标，如果找不到，则到up.link server上去找。
　　可选的align属性用来表明图片同当前行文本的对齐方式，默认值为bottom，可选to和middle。
　　height、width、vspace、hspace属性分别指定图片的长宽和距环绕文字的间距，目前不是所有的wap手机都支持这些属性。

示例：

<img src="http://wap.sina.com.cn/wbmp/logo.wbmp" alt="sina"/>

转载于:https://www.cnblogs.com/kangtr/archive/2005/12/02/289545.html