CloverTools更新

    对上次的工具进行了一些更新，增加了获取元素坐标的功能，增加了让checkbox拥有对某一区域隐藏显示的功能，增加了初始化一个input提示文字并初始化其样式的功能。

    除此之外对Validator这个表单验证工具的时间顺序验证做了一些调整，允许在dateAfter=?和dateBefor=?的“？”部分添加日期字符串，格式为“yyyy-MM-dd”，原来的使用方法依然有用。

   顺便粘一部分用于构造Validator的代码：

/* 注意：添加验证应该在页面加载完毕之后，否则会找不到DOM对象，因此应该加载在一个OnLoad事件中 */
clover.event.addOnLoadEventListener(function(){
    /* 注意，如果需要手动执行验证，请将Validator对象设为全局变量 */
    validator = new clover.form.Validator("testForm");
    
    /* 需要将错误信息显示在页面中的一个位置，打开此选项 */
    //validator.enableOnPageErrorDisplaySingleBox("error");
    
    /* 需要将错误信息显示在页面中的不同位置，打开此选项 */
    //validator.enableOnPageErrorDisplay("?_errorloc");
    
    /* 需要单条显示错误信息，打开此选项 */
    //validator.enableSingleErrorDisplay();
    
    validator.addValidation("name", "req", "请填写姓名");
    validator.addValidation("name", "Chinese", "姓名必须为中文");
    
    validator.addValidation("gender", "select", "请选择性别");
    
    validator.addValidation("email", "req", "请填写E-mail");
    validator.addValidation("email", "email", "E-mail不合法");
    
    validator.addValidation("sign", "maxlength=6", "签名长度不得超过20个字符");
    
    validator.addValidation("idCard", "idCard", "身份证格式不合法");
    
    validator.addValidation("from", "date", "开始日期不合法");
    validator.addValidation("from", "afterDate=1987-2-9", "必须大于1987年2月9日");
    validator.addValidation("from", "beforeDate=to", "开始日期必须在结束日期之前");
    
    validator.addValidation("to", "date", "结束日期不合法");
    
    validator.addValidation("ip", "ip", "IP不合法");
    
    validator.addValidation("float", "float=2", "请填写小数，小数位数不得超过两位");
    
    validator.addValidation("level", "select", "请选择等级");
    
    validator.addValidation("favor", "select=2", "请选择两个兴趣");
    
    validator.addValidation("s", "sensitive", "不得包含敏感字符");
    
    /* 添加一个全选功能 */
    clover.form.addSelectAllFunction("favorAll", "favor", "testForm");
    
    clover.form.addInputTips("name", "请填写姓名", "oldStyle", "newStyle");
});

 下面是对应的HTML表单：

<form name="testForm" action="#">
	<table cellspacing="1px">
		<tr>
			<th>项目</th>
			<th>字段</th>
			<th>消息反馈</th>
		</tr>
		<tr>
			<th><span class="important">*</span>姓名:</th>
			<td><input type="text" name="name" id="name" /></td>
			<td><span id="name_errorloc" class="important"></span></td>
		</tr>
		<tr>
			<th><span class="important">*</span>性别:</th>
			<td>
				<label><input type="radio" name="gender" value="male" />男</label>
				<label><input type="radio" name="gender" value="female" />女</label>
			</td>
			<td width="200px"><span id="gender_errorloc" class="important"></span></td>
		</tr>
		<tr>
			<th><span class="important">*</span>邮箱:</th>
			<td><input type="text" name="email" /></td>
			<td><span id="email_errorloc" class="important"></span></td>
		</tr>
		<tr>
			<th>身份证:</th>
			<td><input type="text" name="idCard" /></td>
			<td><span id="idCard_errorloc" class="important"></span></td>
		</tr>
		<tr>
			<th>签名：</th>
			<td><textarea name="sign"></textarea></td>
			<td><span id="sign_errorloc" class="important"></span></td>
		</tr>
		<tr>
			<th>日期：</th>
			<td>
				从<input type="text" name="from" size="10" />
				到<input type="text" name="to" size="10" />
			</td>
			<td>
				<span id="from_errorloc" class="important"></span>
				<span id="to_errorloc" class="important"></span>
			</td>
		</tr>
		<tr>
			<th>IP：</th>
			<td><input type="text" name="ip" /></td>
			<td><span id="ip_errorloc" class="important"></span></td>
		</tr>
		<tr>
			<th>小数：</th>
			<td><input type="text" name="float" /></td>
			<td><span id="float_errorloc" class="important"></span></td>
		</tr>
		<tr>
			<th>敏感字符：</th>
			<td><input type="text" name="s" /></td>
			<td><span id="s_errorloc" class="important"></span></td>
		</tr>
		<tr>
			<th><span class="important">*</span>等级：</th>
			<td>
				<select name="level">
					<option value="">请选择：</option>
					<option value="1">1</option>
					<option value="2">2</option>
				</select>
			</td>
			<td><span id="level_errorloc" class="important"></span></td>
		</tr>
		<tr>
			<th><span class="important">*</span><input type="checkbox" id="favorAll" />兴趣：</th>
			<td>
				<input type="checkbox" name="favor" value="1" />1
				<input type="checkbox" name="favor" value="2" />2
				<input type="checkbox" name="favor" value="3" />3
				<input type="checkbox" name="favor" value="4" />4
				<input type="checkbox" name="favor" value="5" />5
				<input type="checkbox" name="favor" value="6" />6
			</td>
			<td><span id="favor_errorloc" class="important"></span></td>
		</tr>
		<tr>
			<th>消息区：</th>
			<td colspan="2" id="error" class="important"></td>
		</tr>
	</table>
	<div>
		<button type="button" onclick="validator.validate()">验证</button><span class="description">手动执行验证</span>
		<button type="submit">提交</button><span class="description">提交自动执行验证(需要有from标签)</span>
	</div>
</form>