- 博客(32)
- 收藏
- 关注
RSS订阅原创 js设置用户当input、textarea值改变没有保存时关闭或离开页面则提醒用户保存信息(onbeforeunload)
var dirty = false;//是否有输入的内容未保存标志，初始值为false $(document).on("change","input,textarea,select",function(){ dirty = true; }); $("#id").on("click", function() { dirty = false; });window.onbeforeunload = function(event){ .
2021-03-22 13:05:38
591
1
原创 JS数组排序及去重
var arr = [1,1,2,2,4,5,2,1,2];//一、数组排序 //1、冒泡排序法 for(var i=0;i<arr.length;i++){ for(var j=0;j<arr.length-i;j++){ if(arr[j]>arr[j+1]){ var a=arr[j]; arr[j] = arr.
2021-02-20 13:18:10
121
原创 JS实现模拟购物车功能计算商品件数及价钱总和
style部分 ul>li{ font-size: 20px; margin-bottom: 10px;}body部分 <div style="font-size: 30px;text-align: center;color: brown;">模拟购物车测试案例</div> <ul id="list"> <li> <input type="button" va
2021-02-20 13:11:28
1967
2
原创 解决video禁止自动全屏播放问题（ios、安卓）
同层页面内播放是标准的视频播放形态，安卓在video标签中添加且只需要添加一个(不要与x5-playsinline同时存在):x5-video-player-type='h5-page'属性来控制网页内部同层播放，可以在视频上方显示html元素ios 在video标签中添加webkit-playsinline="true"playsinline="true" 即可...
2021-01-28 13:57:56
2325
1
原创 微信浏览器内打开App Store链接，并跳转到App指定安装页面
id1234567 代表’id’ + appid，这里的是 测试的数据，在html中加上这个链接 https://itunes.apple.com/cn/app/id1234567可以唤起苹果商店直接在浏览器中输入此链接 也可以唤起 苹果商店
2021-01-19 11:28:19
4376
2
原创 移动端底部input唤醒手机软键盘遮挡输入框问题
<input type="text" value="" class="tinput"/> //针对直接在浏览器打开此方法有效 $('.tinput').bind('focus', function() { // 软键盘弹起之后再调整滚动条位置 if ($(this).offset().top > document.body.scrollHeight / 2) { setTimeout(function (
2020-11-11 16:29:33
796
原创 ios输入input事件弹出软键盘后页面未回到底部(及点击input 弹出软键盘首字母默认大写)
最近app嵌套H5页面时，需要input输入，但是在ios屏幕上时，input引起软键盘弹出，此时ios页面高度发生变化，ios屏幕为保证输入框在可视范围内，往往会发生滑动。但是输入结束后，屏幕未回到底部。导致底部出现高度差。处理方法：监听window屏幕的foucusin和focusout事件，视情移动屏幕至底部此处做了延时执行，是因为在输入框切换的时候也会触发focusout和focusin事件，但此时用户输入并未完成，所以做30毫秒延时，避免触发回到底部。//用户完成输入时，点击输入完成，收回软
2020-07-10 17:30:29
862
原创 获取地理位置坐标GPS，GPS坐标转百度坐标
<p><button class="btn btn-success btns">点击获取坐标</button></p><p>经度： <input id="long" type="text" value="" /></p><p>纬度： <input id="lat" type="text" value="" /></p> $(".btns").click(function(){
2020-07-02 14:53:01
814
1
原创 解决audio、video视频在ios微信浏览器中不能自动播放的问题
解决audio、video视频在ios微信浏览器中不能自动播放的问题由于Android，IOS移动端的浏览器以及微信自带的浏览器为了用户更好的体验，规定不自动播放音频视频，默认屏蔽了autoplay，如果要想达到自动播放效果，需要单独处理解决方法一：在页面中引入微信插件：<srcipt src="http://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>页面中添加html代码：<audio controls="
2020-07-02 14:50:42
6115
5
原创 压缩图片base64格式
html代码<div id="preview"> <input type="file" id="file" value="" onchange="imgsrc(event)" /> <img id="imgs" /></div>js代码//第一个参数就是原来的字符串，第二个是宽度，第...
2019-12-24 14:45:12
710
原创 前端解析数组Json字符串中有\r\n换行符
将Json字符串中所有的\r\n转成\\r\\n注意：不能使用replace(/[\r\n]/g,"\\r\\n")同时\r\n转换，如果是\r\n连续出现的时候，就会被替换两次，三次....死循环下去。可以分两次转换：replace(/[\r]/g, "\\r").replace(/[\n]/g, "\\n")...
2019-12-20 13:28:54
3643
原创 ios下iframe页面内容宽度超出屏幕宽度
iframe，ios下iframe页面内容宽度超出屏幕宽度安卓，pc上面测试正常，ios异常解决方案：<div style="overflow: auto;-webkit-overflow-scrolling:touch;width:100%;height:100%;"> <iframe src="https://mp.csdn.net/postedi...
2019-09-04 18:37:04
452
转载 img取消无图片时的默认边框
当img中间无图片时显示默认边框，在firefox中是没有的，但是Chrome中显示，尝试用border:0无效可以使用属性选择器设置opacity为空img[src=""],img:not([src]){ opacity:0;}...
2019-05-13 13:38:02
2736
原创 （安卓和ios）关于select最佳兼容性解决方案(css)
样式一：.select{ width: 100%; border: none; background: #f1f6fa; color: #666; height: 40px; appearance:none; -moz-appearance:none; -webkit-appearance:none; back...
2019-04-08 14:04:22
1910
原创 ios长按按钮不出现弹出框（及长按不出现放大镜效果、点击数字不出现拨打电话弹出框）
在a链接 加入css 弹窗就不会出现-webkit-touch-callout: none;ios点击数字会弹出拨打电话弹出框：解决方案：将下列代码添加到页面的head中<meta name="format-detection" content="telephone=no"><meta http-equiv="x-rim-auto-match" content="n...
2019-03-26 16:15:02
3088
原创 移动端左滑出现标记成未读及删除按钮
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><
2019-03-13 14:13:08
480
转载 JavaScript构造函数学习：js中构造函数与普通函数的区别
构造函数不仅只出现在JavaScript中，它同样存在于很多主流的程序语言里，比如c++、Java、PHP等等。与这些主流程序语言一样，构造函数在js中的作业一样，也是用来创建对象时初始化对象，并且总与new运算符一起使用。在js中，构造函数与普通函数的区别不是很大。接下来就主要讲讲两者的区别。1.在命名规则上，构造函数一般是首字母大写，普通函数则是遵照小驼峰式命名法。2.在函数调用时...
2019-01-02 15:32:07
1828
转载 彻底弄懂JS的事件冒泡和事件捕获
事件捕获指的是从document到触发事件的那个节点，即自上而下的去触发事件。相反的，事件冒泡是自下而上的去触发事件。绑定事件方法的第三个参数，就是控制事件触发顺序是否为事件捕获。true,事件捕获；false,事件冒泡。默认false,即事件冒泡。Jquery的e.stopPropagation会阻止冒泡，意思就是到我为止，我的爹和祖宗的事件就不要触发了。这是HTML结构 1 ...
2018-12-04 13:20:12
124
原创 JS匿名函数和闭包
一、匿名函数函数是JavaScript中最灵活的一种对象，这里只是讲解其匿名函数的用途。匿名函数：就是没有函数名的函数函数定义常规方式第一种：这也是最常规的一种function double(x){ return 2 * x; }第二种：这种方法使用了Function构造函数，把参数列表和函数体都作为字符串，很不方便，不建议使用。（deprecated）var ...
2018-11-14 13:40:09
434
原创 介绍JavaScript面向对象
JavaScript中的引用类型引用类型通常叫做类（class），也就是遇到引用值或者处理的对象。但是从严格意义上讲JavaScript并不是面向对象的，而是基于对象（object）的。之所以说是基于面向对象的原因是JavaScript中并没有类似Java中的多态，抽象，重载等面向对象语言中的概念。但是JavaScript中定义了"对象定义"，在逻辑上等价于其他面向对象语言中的"类"的概念。 ...
2018-11-14 13:33:54
148
原创 Git 命令总结，从零到熟悉（全）
什么是 Git？Git 是一个免费的开源分布式版本控制系统，它的设计目的是为了速度和效率的处理从小型到大型的项目；Git 可以帮我们管理我们的代码，记录历史，只要代码提交到 Git 上就永久不会丢失，可以随时 “穿越”（回到之前的某一个版本）；可以多端共享，团队协作中，多个人操作了同一个文件时，可以实现自动合并（模块化，组件化）、标记冲突，拥有强大的分支管理系统。Git 与 SVN...
2018-08-01 13:21:25
318
原创 JavaScript 的继承方式及优缺点
前言JavaScript 原本不是纯粹的 “OOP” 语言，因为在 ES5 规范中没有类的概念，在 ES6 中才正式加入了 class 的编程方式，在 ES6 之前，也都是使用面向对象的编程方式，当然是 JavaScript 独有的面向对象编程，而且这种编程方式是建立在 JavaScript 独特的原型链的基础之上的，我们本篇就将对原型链以及面向对象编程最常用到的继承进行刨析。继承简介...
2018-08-01 13:12:14
189
原创 浅谈 JavaScript 原型链
概述在 JavaScript 中有种说法叫 “万物皆对象”，就是说无论是构造函数创建的实例，构造函数本身、原型对象、数组、函数本质上都是对象，都拥有 __proto__ 属性，即隐式原型，所有函数都拥有 prototype属性，即显式原型（仅限函数），原型对象（prototype 属性指向的对象），在定义函数时就被创建。原型链指向概述在 JavaScript 中整个原型链及查找机制...
2018-08-01 13:10:49
257
原创 js获取键盘事件
js 里面的键盘事件经常用到，所以收集了键盘事件对应的键码来分享下：keyCode 8 = BackSpace BackSpacekeyCode 9 = Tab TabkeyCode 12 = ClearkeyCode 13 = EnterkeyCode 16 = Shift_LkeyCode 17 = Control_LkeyCode 18 = Alt_LkeyCode 19 = PausekeyCode 20 = Caps_LockkeyCode 27 = Escape Escape
2017-08-21 11:01:08
311
原创 常见html5语义化标签
语义化HTML：用最恰当的HTML元素标记的内容。 优点：1 提升可访问性； 2 SEO； 3 结构清晰，利于维护； （HTML5旧的行内元素都被归类为短语内容） 通用容器：div——块级通
2017-06-05 15:37:49
946
原创 javascript深入理解js闭包
一、变量的作用域要理解闭包，首先必须理解Javascript特殊的变量作用域。变量的作用域无非就是两种：全局变量和局部变量。Javascript语言的特殊之处，就在于函数内部可以直接读取全局变量。Js代码 var n=999; function f1(){ alert(n); } f1(); // 999另一
2017-05-09 09:48:22
194
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人