WEB前交互快速开发指南.ppt

WEB前端交互快速开发指南 EasyUI使用介绍(dh20156风之石) WEB页面中常见的功能形式 切换： 表单验证 树状展示(此功能多见于WEB管理员页面) AJAX(提交数据、获取数据) 结构与功能分离 结构与功能分离 EasyUI 概述 作者：杜欢(dh20156风之石) 风格：简约 功能：相对齐全 扩展：方便 使用：简单 大小：8.9K，JS Minifier处理后为7K 组成：EasyUI.js + 扩展的附加组件 官网：/easyui/ EasyUI Core API easyUI.fpbind() 自执行方法,为Ftotype添加bind方法，用于提供保持对象作用域的事件方法的邦定 参数：无 返回值：无 easyUI.IAHTML() 自执行方法,为HTMLEtotype添加insertAdjacentHTML方法，用于为不支持insertAdjacentHTML方法的浏览器提供兼容 参数：无 返回值：无 easyUI.contains(node,childNode) 用于判断两个DOM节点之间是否存在包含与被包含的关系 参数：DOM元素A,DOM元素B 返回值：true|false easyUI.getElementsBy(attribute,value,tagName,scopeDom) 在指定的DOM节点scopeDom下查找属性名称为attribute，属性值为value的，tagName为tagName的DOM元素 参数：attribute属性名称,属性值value,DOM元素tagName,指定要查找的DOM节点范围scopeDom 返回值：DOM Collection easyUI.getPosition(domobj) 取元素坐标，如元素或其上层元素设置position relative，应该getPosition(子元素).y-getPosition(父元素).y 参数：DOM元素 返回值：{x:value,y:value} easyUI.getTarget(event) 获取事件触发对象 参数：event 返回值：DOM元素 easyUI.getArgs() 获取URL参数 参数： 返回值：{argName:value,...,argName:value} easyUI.setPosition(domobj,x,y) 为dom元素设置x坐标和y坐标 参数：DOM元素,x,y 返回值： easyUI.getStyle(domobj,stylename) 获取元素当前样式 参数：domobj,stylename 返回值：cssStyle value easyUI.stopEvent(event) 阻止事件冒泡和Event返回值 参数：event 返回值： easyUI.ajax.post(sUrl,sArgs,bAsync,fCallBack,fFailure) 使用xmlhttp发送post请求 参数：sUrl 请求地址,sArgs 请求参数串,bAsync 是否异步,fCallBack 回调函数,fFailure 服务器错误处理函数 返回值： easyUI.ajax.get(sUrl,bAsync,fCallBack,fFailure) 使用xmlhttp发送get请求 参数：sUrl 请求地址(包括请求参数),bAsync 是否异步,fCallBack 回调函数,fFailure 服务器错误处理函数 返回值： easyUI.clearTxtNode(domobj) 清除DOM元素内的#text节点 参数：domobj 返回值： easyUI.checkForm(form,fooWarningMsg) 验证form表单 为需要验证的输入项添加两个自定义属性作为判断的依据以及需要执行的验证 validate=这里输入验证方法，多种验证以分号隔开 msg=这里输入验证不合格时提示的信息，与validate一一对应，如果信息数少于验证方法数量，则后面的验证不合格时将显示最后一条提示信息 验证方法: isFilled 必填 isNaN 如果填写，必须为非数字 isNumber 如果填写，必须为数字 isInt 如果填写，必须为整数 isEmail 如果填写，必须为Email格式 isEmailList 如果填写，必须为以分号;隔开的1个或多个Email格式 fileType(ext|ext|ext|...|ext) 如果填写，必须为指定扩展名ext列表内的文件类型 moreThan(N) 如果填写，必须为大于N的数 lessThan(N) 如果填写，必须为小于N的数 equalTo(N) 如果填写，必须为等于N的数 maxLength(N) 如果填写，