网页布局之一
来源：互联网 发布：淘宝客服结束语回复 编辑：程序博客网 时间：2024/05/16 09:18
昨天一直在做jsp页面的布局，在真正接触了java的网页编写，我才知道原来jsp也有许多的与Asp.net一样的控件可以使用，而且似乎jsp的程序员的自由度更高，他允许前台和逻辑控制的完全分离。
但是，我现在只是在做前台页面的工作，所以我就总结制作页面的一些心得。
一、在做页面的行列布局时，html的<div>和<span>标签完全可以代替<table>的<tr>,<td>标签。虽说可以替换，但是在做单一页面样式时，还是没有<table>简单实用。
二、在标签中一切的标签样式都可以使用标签的style属性来解决，例如<div style="width:1024px;border:2;height:auto;"等等。
三、在做网页文本输入框的验证时，我们使用的是jquery的easyui。既然是使用jquery，那最好是写一个jquery的脚本文件。在写文件之前，一定要把jquery-easyui的库文件导入到项目中。
四、在js中编写easyui的validatebox的扩展方法，源代码如下：
//function validate(){$.extend($.fn.validatebox.defaults.rules,{user:{//验证用户名validator:function(value){return /^[a-zA-Z][a-zA-Z0-9]{5,15}$/i.test(value);},message:'用户名不合法,字母开头，允许6-16字节'},name:{//验证真实姓名，可以是中英文validator:function(value){return /^[\u4e00-\u9fa5]{2,6}$/i.test(value)|/^[a-zA-Z]{6,16}$/i.test(value);},message:'请输入真实姓名,可以是中英文,中文2-6个字符，英文6-16个字节'},password:{validator:function(value){return /^[a-zA-Z0-9]{6,32}$/i.test(value);},message:'请输入密码，6-32位'},repassword:{validator:function(value,param){return $(param[0]).val() == value;},message:'两次密码不一致'},//////////////////////////////////////////////////////////////////////phone:{validator:function(value){var len=$.trim(value).length;if(len>=10){return /^(13|15|18|14)\d{9}$/i.test(value);}else{return /^((\(\d{2,3}\))|(\d{3}\-))?(\(0\d{2,3}\)|0\d{2,3}-)?[1-9]\d{6,7}(\-\d{1,4})?$/i.test(value);}},message:'格式不正确,请使用下面格式:020-88888888或手机12345678900'},/////////////////////////////////////////////////////////////////////////////email:{validator:function(value){return /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/.test(value);},message:'请输入有效的e-mail账号（例如：abc@163.com）'},address:{validator:function(value){return /^(?=.*?[\u4E00-\u9FA5])[\d\u4E00-\u9FA5]+$/i.test(value);},message:'住址只能有汉字和数字（不能全为数字）'},idNO:{validator:function(value){return /^\d{15}(\d{2}[A-Za-z0-9])?$/i.test(value); },message:'身份证号格式不对'}});function submitReg(){var flag=$("#regform").form('validate'); //alert(flag);if(flag==true){return alert("注册成功！");}else{return alert("输入信息有误，注册失败！");}}五、在jsp页面中引用js文件：<script type="text/javascript" src="../../js/validate.js"></script></p><p> 引入脚本文件后，在input标签中的使用方法是class，data-options和validType属性，例如： <span class="FontRed">*</span><span><font color="black">用户名:</font> <input class="easyui-validatebox" type="text" name="user" validType="user" id="user" data-options="required:true" missingMessage="不能为空"/> </span><!-- <span>请填入信息！</span><br> --> 最后是两个button功能的编写： <input type="button" name="submit" id="submit" value="完成" onclick="submitReg()"> <input type="reset" name="reset" id="reset" value="重置"> </span> 初出茅庐，望不吝赐教。
0 0
- 网页布局之一
- 常用网页布局（div+css）之一
- 网页布局
- 网页布局
- 网页布局
- 网页布局
- 网页布局
- 网页布局
- 网页布局
- 网页布局
- 网页布局
- 网页布局
- 网页布局
- 网页布局
- 网页布局
- 网页布局
- 网页布局
- 网页布局(div布局)
- 设计模式初探-单例模式(Singleton)
- 按键精灵函数
- Redis作者谈Redis应用场景(转)
- 如果在eclipse平台上开发android项目时content assist没有效果，看这里!!!
- FFMPEG-数据结构解释(AVCodecContext,AVStream,AVFormatContext)
- 网页布局之一
- 系统盘丢失数据如何恢复
- 转载：关于借钱的事，转的
- win8 32位系统安装sql2012
- web.xml配置
- adb 不能正确启动全解决
- TiledMap地图视点移动
- Bluetooth: ATT and GATT
- Asp.net登录框架的自定义
