JS
半笙彷徨
追求自我,超越自我
展开
-
jq监听input文本变化
使用jq的change方法监听input的文本变化事件,只有在input失去焦点时才会触发事件:$('input[name=myInput]').change(function() { ... });假如需要实现当文本发生就触发事件,可以使用on方法来绑定事件:$('input.myTextInput').on('input',function(e){ alert('Changed!')});原创 2017-01-09 14:26:38 · 2812 阅读 · 0 评论 -
JS-wangEditor自定义上传多张图片
wangEditor是一款开源的富文本编辑器,除默认实现,还提供非常多自定义参数,看看如何自定义上传多张图片。var E = window.wangEditor;var editor =new E('#description');initEditor(editor);editor.customConfig.uploadImgServer = 'product/upload';edito...原创 2018-09-25 19:26:19 · 4578 阅读 · 1 评论 -
JS-判断客户端类型
使用mobile-detect.js判断客户端类型,比如PC、Android、IOS。<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <script src="//cdn.bootcss.com原创 2018-09-26 14:20:51 · 516 阅读 · 0 评论 -
JS-设置或更新URL参数
使用JS设置或更新URL参数的几种方式第一种,使用正则表达式匹配://参数值不为空时,存在参数则更新,否则不操作function updateQueryStringParameter(uri, key, value) { if(!value) { return uri; } var re = new RegExp("([?&])" + key + "=.*?(&|$...原创 2018-11-29 14:12:18 · 5010 阅读 · 0 评论 -
JS-删除url参数
JS删除url参数function removeURLParameter(url, parameter) { var urlparts = url.split('?'); if(urlparts.length >= 2) { //参数名前缀 var prefix = encodeURIComponent(parameter) + '='; var pars = urlpar...原创 2018-11-29 14:24:52 · 7025 阅读 · 2 评论 -
JS-向当前url追加参数
JS-使用history的replaceState方法向当前url追加参数var newurl = updateQueryStringParameter(window.location.href, 'sp', '2');//向当前url添加参数,没有历史记录window.history.replaceState({ path: newurl}, '', newurl);functio...原创 2018-11-29 14:29:13 · 23664 阅读 · 2 评论 -
JS-判断元素在当前窗口是否可见
JS-判断元素在当前窗口是否可见/** * 判断元素是否可见 * @param {Object} elm */function checkVisible(elm) { var rect = elm.getBoundingClientRect(); //获取当前浏览器的视口高度,不包括工具栏和滚动条 //document.documentElement.clientHeigh...原创 2018-11-29 14:52:05 · 6856 阅读 · 0 评论 -
JS-判断设备是否是移动设备
使用JS判断设备是否是移动设备。<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> </body> &a原创 2018-12-23 21:48:35 · 1368 阅读 · 0 评论 -
JS-判断设备操作系统是Andorid还是IOS
使用current-device.min.js判断设备操作系统是Andorid还是IOS。<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <script src="https://unpkg.c原创 2018-12-23 22:39:43 · 700 阅读 · 0 评论 -
JS-点击图片下载到本地
先使用canvas显示图片,接着使用toDataURL()方法获取图片展示的 data URI,通过在a链接设置download属于,点击将图片内容下载到本地。<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> &原创 2018-12-23 23:25:01 · 2570 阅读 · 0 评论 -
JS-监控input文本内容变化
需要监控input是否有值,可通过监听change、keyup、paste3个事件判断。<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>input_change</title> <script src="htt原创 2018-12-29 15:16:11 · 1783 阅读 · 0 评论 -
JS-使用clamp.js-限制文本显示行数
使用clamp.js限制文本显示行数<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>line-clampin</title> <script src="https://cdn.bootcss.com/jquer原创 2018-12-29 15:47:38 · 2467 阅读 · 0 评论 -
JS-设置input光标位置
设置input光标位置:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body>原创 2018-09-09 18:25:44 · 12404 阅读 · 1 评论 -
JS-向数组指定位置添加元素
向数组指定位置添加元素:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> &a原创 2018-09-09 18:21:43 · 40888 阅读 · 2 评论 -
JS-读取txt文件内容
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <input原创 2018-09-09 14:08:33 · 60336 阅读 · 10 评论 -
jquery_lazyload插件学习
在加载有很多图片的页面时,如果一开始就把图片加载完的话,会导致页面加载速度慢,而且有时用户并不会看完整个页面,所以一开始就加载完所有图片不太合理。有个JQuery插件可以实现图片的懒加载,就是先加载用户当前视图的图片,滑倒滚动条后再加载其他图片。jquery_lazyload插件的地址: https://github.com/tuupola/jquery_lazyload介绍下简单的用法:1.原创 2017-01-22 18:18:26 · 603 阅读 · 0 评论 -
JS-判断数组是否包含某个数
前言实际开发经常遇到这样的需求:判断数组是否包含某个数; 在2016年发布ECMAScript的第个七版ECMScript 2016即是es7中的新特性有一个方法includes(),可用此方法来判断。代码[1, 2, 3].includes(2); // true[1, 2, 3].includes(4); // false[1, 2, 3].includes(...原创 2018-07-14 14:01:00 · 3370 阅读 · 1 评论 -
JQ-获取选中的Checkbox
使用JQuery获取选中的Checkbox:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="https原创 2018-07-14 14:22:00 · 781 阅读 · 0 评论 -
JS-FormData对象使用
前言FormData 对象用来保存key/value结构的数据,通常用于from传输数据,也可以独立于form使用,用来传输密钥数据。例子1.创建FormData对象var formData = new FormData();formData.append("username", "Groucho");formData.append("accountnum", 123..原创 2018-07-14 17:40:39 · 10342 阅读 · 0 评论 -
JS-获取当前URL的参数
链接:http://localhost:8080/test/upload?test1=1&test2=2 获取问号后面的参数//返回对象function getUrlVars() { var vars = {}; var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/g...原创 2018-07-14 18:12:54 · 1507 阅读 · 0 评论 -
JQ-$.each()方法使用
jQuery的$.each()函数是全局函数,用于循环遍历jQuery对象的每个元素,它对于多元素DOM操作,循环任意数组和对象属性非常有用。 除了这个函数之外,jQuery还提供了一个具有相同名称的辅助函数,可以在不事先选择或创建DOM元素的情况下调用它。语法$.each(object,[callback]);参数object :需要遍历的对象或数组。callback:每个...原创 2018-07-15 00:09:16 · 15314 阅读 · 0 评论 -
JS-上传多张图片-支持拖动设置顺序-跨域上传
功能1.上传多张图片,放弃传统input.file形式上传,自定义数组保存文件; 2.可一次性选择多张图片,可追加图片,图片可以预览; 3.可拖动图片,顺序默认从左0开始; 4.可删除单个图片,或清空所有图片; 5.跨域上传;html&amp;lt;!DOCTYPE html&amp;gt;&amp;lt;html&amp;gt; &amp;lt;head&amp;gt;原创 2018-08-18 16:16:48 · 4452 阅读 · 2 评论 -
JQ-data()方法没有更新DOM问题
前言使用data()方法给元素添加data-*属性是很常见的操作,但是data()方法操作的数据保存在jQuery内部,而并没有改变DOM的属性。看下例子Demo&lt;!DOCTYPE html&gt;&lt;html&gt; &lt;head&gt; &lt;meta charset="UTF-8"&原创 2018-08-18 17:16:19 · 2287 阅读 · 0 评论 -
JQ-获取当前元素位置
使用JQuery的prevAll()方法获取当前元素之前有多少同级元素。<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>获取当前元素位置</title> </head>原创 2018-08-18 17:46:13 · 3005 阅读 · 0 评论 -
JS-如何实现sleep
在JS,要实现sleep,可以异步函数实现,代码:function sleep(ms) { return new Promise(resolve =&gt; setTimeout(resolve, ms));}async function demo() { console.log('Taking a break...'); await sleep(2000); conso...原创 2018-09-08 17:22:16 · 2886 阅读 · 1 评论 -
JQ-ajax使用CORS-AnyWhere实现任意跨域请求
使用ajax发起请求,如果是跨域请求,浏览器会报以下“错误”:Failed to load https://example.com/: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘https://anfo.pl' is therefore not allowed...原创 2018-09-08 17:49:55 · 4145 阅读 · 3 评论 -
JS-时区选择-获取当前时区
一个时区选择插件的使用,以及获取当前时区的例子。<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <script src="https://cdn.bootcss.com/jquery/3.3.原创 2018-12-29 17:18:24 · 18618 阅读 · 1 评论