![](https://img-blog.csdnimg.cn/20201014180756757.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端
RunningOnMyWay
这个作者很懒,什么都没留下…
展开
-
vuecli4 多页面时router-view只渲染主页问题
在需要渲染的其他页面的vue加入如下代码可以使用 this.$router.push(location) 来修改 url,完成对其他页面的渲染export default {created(){ console.log('-----'); this.$router.push({path:"/m"}) //对应需要渲染的页面第一个path 其他页面正常使用router-link的方式 } }对应的router.jsconst routes = [ { path:原创 2021-06-27 00:30:04 · 358 阅读 · 0 评论 -
flex布局二 更简单实现移动端topbar
左边返回按钮、中部标题、最右侧搜索示例:原创 2021-04-29 15:30:59 · 119 阅读 · 0 评论 -
flex布局一 使实现grid网格布局更简单
效果如下:容器div的css样式.grid-box{ display:flex; flex-flow: row wrap; width:100%;}容器内item的css样式.grid-box-item{ width:calc(calc(100% / 3) - 10px); //使用calc实时计算width height: 60px; margin: 5px; box-sizing: border-box; border-radius:15px;}为了使原创 2021-04-12 17:34:24 · 744 阅读 · 1 评论 -
Vuecli4.5.9 本地服务器访问跨域问题
修改项目目录下的config/index.js中的proxyTable,修改内容如下:proxyTable: { "/blogs":{ target: 'https://www.llxrandom.com', changeOrigin: true, } }这是用于本地的生产环境中使用原创 2021-03-29 17:31:00 · 306 阅读 · 0 评论 -
JavaScript的Array对象方法的高级用法
目录1.concat() 数组拼接2.every() 检测元素3.filter() 过滤4.forEach() 遍历回调5.join() 数组转换字符串6.map() 处理数组数据并返回7.sort() 排序1.concat() 数组拼接连接两个或更多的数组,并返回结果,使用简单示例如下:var arr1 = [1,2,100,1000];var arr2 = [11,3,2];var arr3 = [1,2,3];var newArr = arr1.concat(arr2,arr3);con原创 2021-03-23 16:27:23 · 200 阅读 · 0 评论 -
nodejs+Vuecli+webpack 创建项目一
目录1. 安装nodejs环境2.安装vuecli3. 创建初始化项目4.启动项目5.使用浏览器访问1. 安装nodejs环境使用npm -v 查看安装>npm -v6.14.82.安装vuecli@next 安装最新的稳定版本npm install -g @vue/cli使用下方命令检查是否安装成功,以及安装的版本vue -V3. 创建初始化项目vue init webpack vuedemo ? Project name (vuedemo) //项目名称,可原创 2021-03-15 22:37:03 · 157 阅读 · 0 评论 -
iscroll4 滚动内容溢出屏幕问题
使用iscroll4 解决了可编辑元素的focus问题,也解决了滚动条刷新需要加一定的延时等待html数据加载完成问题,但是遇到了一个由于移动端的软件盘弹出后影响了页面布局,导致滚动内容溢出到可见窗体之外,尤其是在聚焦状态下滚动时极易发生该种情况目前遇到问题的wrapper使用的绝对定位加入一个监控窗口大小变化时的监听,参考自针对移动端键盘弹起页面布局样式改变问题var winHeight = $(window).height(); //获取当前页面高度 $(window).resize(fun原创 2020-12-08 16:15:19 · 231 阅读 · 0 评论 -
H5 contentEditable 创建可编辑区域
本文实现的是点击时div变为可编辑,在移除焦点后恢复不可编辑状态,以及在编辑过程中显示编辑内容的实时变化1. HTML部分-webkit-user-select: text;在有些移动端开发时经常会加入禁止选中样式,会导致可编辑区域无法编辑<div onclick="focustest();" onblur="blurtest();" onkeyup="keyuptest();" style="width: 100%;min-height: 30px;-webkit-user-select: t原创 2020-11-24 13:41:01 · 359 阅读 · 2 评论 -
nodejs实现支付宝app支付-自行签名
直接上代码相关参数json数据可参考官方介绍以及相应的必传参数var crypto = require('crypto');//1. 相关参数json数据 var dataobj = { "app_id": "【支付宝分配给开发者的应用 ID】", "method": "alipay.trade.app.pay", "format": "json", "charset": "utf-8",原创 2020-11-02 15:20:52 · 925 阅读 · 0 评论 -
利用伪类:active实现按压样式
<img id="sanqidaifu" alt="" data-original="/img/logox.png?_bda3" src="" style="width:54px" data-hover="hvr-grow" data-pagespeed-url-hash="1107348613" onload="pagespeed.CriticalImages.checkImageForCriticality(this);">原创 2020-10-20 13:38:52 · 633 阅读 · 0 评论 -
H5+jq 父元素绑定事件 处理子元素所有的事件(二)
如何使用元素上直接绑定ontouch onclick的方式实现相同的效果,而不需要使用jquery的监听,示例html部分代码如下:<td class="bt-1" onclick="test()" style="width:50%;padding-top:10px;padding-bottom:10px;"><span>添加患者</span></td>js test方法代码如下:function test(){ var target原创 2020-09-15 09:14:43 · 520 阅读 · 2 评论 -
js 正则表达式的应用
js正则表达式的应用处理HTML字符串1. HTML标签查找2.HTML属性处理HTML字符串1. HTML标签查找如下方的一段html代码,我们需要从中判断查找对应的字符串<p onclick="create();" >sadasdsadsa</p><p id="a" ></p>相关查找代码如下:var str = "<p οnclick=\"create();\" >sadasdsadsa</p><p id=\"原创 2020-08-18 14:06:51 · 199 阅读 · 0 评论 -
jquery word export 导出html内容无样式或无图片问题
1. 首先要准备好对应的js文件jquery文件,FileSaver,以及主要的jquery.wordexport<script type="text/javascript" src="/javascripts/common/jquery.min.js"></script> <script type="text/javascript" src="/javascripts/common/FileSaver.min.js"></script> <原创 2020-07-21 16:44:56 · 6524 阅读 · 104 评论 -
移动端H5 input移动端事件汇总
移动端H5 input事件汇总这里汇总了Android和IOS端的input事件汇总Android 端的H5 input事件1. focus事件2. input事件3. keydown事件4. keyup事件IOS端的H5 input事件1. focus事件2. input事件3. keydown事件4. keyup事件合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创原创 2020-07-06 10:14:26 · 3983 阅读 · 0 评论 -
H5+jq 父元素绑定事件 处理子元素所有的事件(一)
下方以一个按压效果为例,分别绑定了touchstart、touchmove、touchend三种事件,其他的click事件也可以参照;使用e.target(获取到当前事件触发的节点),又通过e.target.nodeName.tolowerCase()获取可对比的小写tagname,来定位不同位置产生的事件;当然,也可以更复杂一些,在对应的元素上设置不同的className或者其他属性,通过对属性的判断可以区分一些相同tagname,用于做不同的事件处理。<!DOCTYPE html><原创 2020-06-23 19:11:27 · 1010 阅读 · 0 评论 -
js JSON.parse()与 split("")效率对比
1. 最新需要考虑存储内容时以JSON字符串的形式还是以字符串特殊间隔的形式保存,首先来对比读取解析为json对象测试代码如下: function ceshi() { console.log("json字符串parse效率测试"); var obj = {"taitoulx":"企业(或个人或事业单位)","fapiaott":"发票抬头","shuihao":"纳税...原创 2019-12-23 18:29:26 · 1325 阅读 · 0 评论 -
jquery实现点击或按压样式类切换
相同className 点击删除点击添加$("#tr").on("click",function(){ $("#minx").toggleClass("className");});不同className 点击切换由classA切换到classB,由classB切换到classA//原理与1 相同 只不过需要多写一个,$("#tr").on("click",functio...原创 2019-08-12 18:04:42 · 468 阅读 · 0 评论 -
HTML5 + CSS3实现app开关样式实现--1
html5代码如下:<span style="float:right" class="off-btn off-bac"><span class="off-btn2 off1"></span> </span><span style="float:right;" class="off-btn off-bac2"><span cl...原创 2019-07-17 10:35:50 · 354 阅读 · 0 评论