前端
夏木炎
个人学习工作记录(只对自己负责),不接受批评,不保证准确,爱看则看。。。
展开
-
ES6数据类型set案例
案例代码:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>数据类型set</title> </head> <body> <script type="tex原创 2018-07-09 09:19:28 · 164 阅读 · 0 评论 -
input+select组合使用封装
一.封装成js;(function($) { var tNum = 0; var InputSelect = function($element, options) { tNum ++; this.sNum = tNum; this.$element = $element; options = options || {}; this.defaults = { v...原创 2018-08-15 14:35:13 · 4730 阅读 · 2 评论 -
WdatePicker时间日期插件总结
一.引入插件二.简单应用案例1).代码<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <input原创 2018-08-15 16:22:06 · 11846 阅读 · 0 评论 -
字体图标兼容IE
一.生成字体图标文件二.导入字体图标库@font-face { font-family:icomoon; src:url('../fonts/icomoon.eot'); src: url('../fonts/icomoon.eot?#iefix') format('embedded-opentype'), url('../fonts/icomoon.svg') format...原创 2018-08-13 16:38:08 · 2632 阅读 · 0 评论 -
CSS元素在父元素居中显示总结
一.水平居中(margin:0 auto;)注意:被包裹的元素不能有浮动属性,否则会失效。示例代码:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style> body原创 2018-08-28 11:05:11 · 2602 阅读 · 0 评论 -
解决IE不支持placeholder
一.解决方法/* * jQuery placeholder, fix for IE6,7,8,9 */var JPlaceHolder = { //检测 _check : function(){ return 'placeholder' in document.createElement('input'); }, //初始化 in...原创 2018-08-31 11:06:20 · 496 阅读 · 0 评论 -
closest() 方法
一.方法含义返回第一个祖先元素二.案例代码<!DOCTYPE html><html><head><meta charset="utf-8"><title>测试closest</title><style>.ancestors *{ display: block; b原创 2018-08-30 14:13:59 · 5755 阅读 · 0 评论 -
鼠标移入显示图片案例
一.需要的效果1).未移入前2).鼠标移入后3).鼠标移出二.实现代码<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <styl原创 2018-09-12 09:35:19 · 5090 阅读 · 0 评论 -
input 取消自动记忆功能
一.首先要<html>前引入<!DOCTYPE>二.input添加属性<input type="text" autocomplete="off" >原创 2018-10-29 15:57:23 · 6790 阅读 · 0 评论 -
JQ each双重循环出错
一.双重循环出错原因:each方法是异步的所以内层的循环时外层也一样在循环,并不会等待内层循环完再执行循环二.替代方法1)使用for2)多选框初始化案例<input type="hidden" id="commTypeNos" name="commTypeNos" value="1,2,3"/><label><input name=&原创 2018-10-29 16:10:08 · 1829 阅读 · 0 评论 -
移动端简单的遮罩层案例
一.CSS样式#loadingBg{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.7);z-index:15000;display:none;}#loadingBg img{position:absolute;top:50%;left:50%;width:33px;height:33px...原创 2018-11-12 15:14:54 · 1979 阅读 · 0 评论 -
JS判断开始时间小于结束时间案例
一.html预计入住时间:<input class="pub_textAlign_right" placeholder="例如,${memoDate }" type="text" name="preLiveInDate" id="preLiveInDate" maxlength="50" readonly="readonly">预计离原创 2018-11-22 16:29:21 · 1967 阅读 · 0 评论 -
JSON获取属性值
一.通过对象名.属性名var obj = '{"name":"hq.zheng", "age":"18"}';var data = eval('('+ obj +')');alert(obj.name);//输出hq.zheng二.通过数组索引var obj = '{"name":"hq.zheng", "age":"18"}';原创 2018-11-27 16:00:38 · 7848 阅读 · 0 评论 -
父页根据iframe子页内容调整iframe页面大小
一.带有iframe的父页1)html<!DOCTYPE html><html><head> <title>带有iframe的父页</title></head><body> <iframe src="" id="businessPage&quo原创 2018-11-28 09:04:43 · 2255 阅读 · 0 评论 -
前端解析Json字符串中有\r\n换行符
一.原因后端接口返回的数据换行采用了\r\n方式,使得json文本无法解析带换行符的内容二.解决方法将Json字符串中所有的\r\n转成\\r\\n注意:不能使用replace(/[\r\n]/g, "\\r\\n")同时\r\n转换,如果是\r\n连续出现的时候,就会被替换两次,三次....死循环下去。可以分两次转换:replace(/[\r]/g, "\\r").re...原创 2019-01-25 13:44:38 · 31868 阅读 · 2 评论 -
前端Jq简单实现全选全不选案例
一.页面<input type="checkbox" id="check_all">...<input type="checkbox" class="check_item">...二.JQ逻辑//全选/全不选功能$("#check_all").click(function(){ $(".check_item&q原创 2019-01-25 15:58:43 · 980 阅读 · 0 评论 -
EL表达式和struts2标签截取字符串
一.EL表达式截取字符串<td align="left" title="${bean.StoreDeptText}"> <c:if test="${fn:length(bean.StoreDeptText)>100 }"> ${fn:substring(bean.StoreDeptText, 0, 100)}... </c:if> &am原创 2018-08-14 17:14:07 · 245 阅读 · 0 评论 -
layer弹窗案例
一.弹出层代码layer.open({ type: 2,//2是弹出iframe title: false, area: ['900px', '450px'], shade : 0.5, content: "<%=basePath%>/hmcp/hightvalue/inventory/hmcpBalance/selectHmcpDept.spring", ...原创 2018-08-14 13:57:57 · 1659 阅读 · 0 评论 -
zTree复选框案例
一.配置树参数//1.获取setting值function getSetting(){ var setting = { view: { dblClickExpand: true, selectedMulti : true,//可以多选 showLine: true }, check: { enable: true ,/...原创 2018-08-14 10:52:31 · 10470 阅读 · 4 评论 -
ES6数据类型Map案例
代码案例:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>数据类型Map</title> </head> <body> <script type="tex原创 2018-07-09 09:43:35 · 368 阅读 · 0 评论 -
ES6数据类型Symbol案例
案例代码:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>数据类型Symbol</title> </head> <body> <script type="原创 2018-07-09 10:22:26 · 191 阅读 · 0 评论 -
ES6面向对象(class)案例
案例代码:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>class的基本运用</title> </head> <body> <script type="原创 2018-07-09 10:46:40 · 810 阅读 · 0 评论 -
ES6绚丽小球案例
案例代码;<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>绚丽小球</title> <style> body{ margin: 150px; } #canvas{ margin原创 2018-07-09 13:40:04 · 576 阅读 · 0 评论 -
ES6模板字符串案例
一.案例代码:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>内置对象扩展</title> </head> <body> <script type="te原创 2018-07-09 15:28:25 · 616 阅读 · 1 评论 -
ES6数组扩展(nodeList转数组)、对象扩展(对象合并)、延展操作符(字符串转数组)
案例代码:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>内置对象扩展</title> </head> <body> <ul> <原创 2018-07-09 16:41:54 · 1262 阅读 · 0 评论 -
ES6函数扩展(设置参数默认值,不确定参数个数,this对象绑定问题)案例
案例代码:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>函数扩展</title> </head> <body> <script type="text/j原创 2018-07-09 17:21:14 · 1845 阅读 · 0 评论 -
自定义字体图标
一.获取字体图标文件(本案例以icomoon为例)1)访问:http://f2er.club/2)选择:框架库3)选择:icomoon4)选择图标或者导入自己的图标生成文件:5)下载生成的文件:得到:icomoon.zip解压:6)将fonts的文件夹复制到自己项目二.引用字体图标库@font-face { font-family:icomoon; src: url('../fonts/ico...原创 2018-06-29 09:48:27 · 1039 阅读 · 0 评论 -
checkbox/radio onchange不能兼容ie8处理办法
一.在ie8下,checkbox的onchange没能实现触发自定义的函数,可以手工触发function forIe(){ if($.browser.msie){ //判断浏览器是否为ie $("input[type='checkbox']").click(function(){ this.blur(); //先失去焦点,执行你的自定义的操作 this....原创 2018-07-12 17:13:50 · 786 阅读 · 0 评论 -
ES6解构赋值案例
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>解构赋值</title> </head> <body> <script type="text/javasc原创 2018-07-06 17:14:06 · 467 阅读 · 0 评论 -
form表单target属性运用
form表单的target,当iframe设置为隐藏时,可以实现当前页表单提交而部进行跳转刷新,代码如下:<form action="提交的action" method="post" target="myIframe">.....................</form><iframe name="myIframe" style="display原创 2018-05-18 17:23:56 · 1913 阅读 · 0 评论 -
window.showmodaldialog 兼容谷歌方案
所有涉及弹窗口的页面均调用这个脚本文件:showModalDialog.jsvar has_showModalDialog = !!window.showModalDialog;//定义一个全局变量判定是否有原生showModalDialog方法 if(!has_showModalDialog &&!!(window.opener)){ window....原创 2018-05-18 10:49:42 · 7242 阅读 · 1 评论 -
页面解析Json小结
1.如果传到页面的是Json对象JSONObject json=JSONObject.fromString(result);request.getSession().setAttribute("json", json);可以这样解析:var last=JSON.stringify(${json});var map = eval("("+last+")");alert(map.date);2....原创 2018-04-25 09:56:02 · 1451 阅读 · 0 评论 -
encodeURI来解决URL传递时的中文问题
1.前端: var url = baseContext+"xxxx.action?parm="+encodeURI(encodeURI('中'));这里要做两次encodeURI的原因以及说明::其中具体的原理分析如下,假设页面端输入的中文是一个“中”,按照下面步骤进行解码1.第一次encodeURI,按照utf-8方式获取字节数组变成[-28,-72-83],对字节码数组进行遍历,把每...原创 2018-06-11 10:40:04 · 3498 阅读 · 0 评论 -
js格式化获取到的系统时间
1.js方法//时间转换格式 Date.prototype.format = function(fmt) { var o = { "M+" : this.getMonth()+1, //月份 "d+" : this.getDate(), //日 "...原创 2018-06-08 09:19:38 · 352 阅读 · 0 评论 -
PostMan无法发送文件问题
一.原因选了form-data,没有设置Content-Type导致,设置为multipart/form-data; boundary=;二.解决方法原创 2019-01-28 17:45:16 · 3185 阅读 · 0 评论