web
ningto.com
个人站点:https://ningto.com
展开
-
简单实现网页登录框中的“记住我”
登录框中通常有一个“记住我”的checkbox按钮,它是用来记住当前用户输入的用户名和密码,下次用户再次登录的时候就不用重新输入直接点击登录就可以了(现在很多浏览器自身就带有这样的功能)。在公用电脑上勾选“记住我”是很危险的,在个人电脑上可以给用户提供很多方便。简单的实现使用Cookie就可以了。简单介绍一下Cookie和Session,详细参考:Cookie/Session机制详解Cookie机制原创 2017-04-14 21:43:02 · 11995 阅读 · 1 评论 -
node.js中exports与module.exports区别
我们知道exports是对module.exports的引用,那么使用的过程中有什么区别呢?使用方法通常我们有两种导出方式,假如将他们都放在test.js文件中给exports增加成员exports.hello = function() { console.log('exports hello')}module.exports.hello = functi...原创 2018-02-19 08:53:27 · 298 阅读 · 0 评论 -
antd按需加载
Ant Design 是一个致力于提升『用户』和『设计者』使用体验的中后台设计语言,利用统一的设计规范、前端实现、设计/研发工具链对产品研发赋能,全面提高中后台产品体验和研发效率。本来react首页渲染速度就很慢,ant按需加载是非常有必要的。打开react-script/config/webpack.config.dev.js找到“Process JS with Babel.”在o...原创 2018-02-19 08:51:10 · 3234 阅读 · 0 评论 -
koa2给所有页面渲染全局数据
场景给我的博客增加显示用户访问量,后台的每个请求访问量都新增1,每个页面的渲染都返回当前访问量计数。捕捉每次请求在所有路由之前新增 app.use(async (ctx, next) => { const totalhit = await Extends.addHit(ctx.path); ctx.state = Object.assign(ctx.state, { totalhi原创 2017-11-04 12:20:22 · 3192 阅读 · 0 评论 -
给marked增加TOC(Table of content)
一直使用marked库解析Markdown,现在想给它增加TOC功能 使用marked解析markdown文本是很简单的,如:marked(markdownText)就可以得到解析后的html内容初始化marked引入库var marked = require('marked');重写renderer.headingtocObj后面再介绍,返回的header中包含了用于定位的锚点。当然你也可以直接原创 2017-11-04 12:19:43 · 4026 阅读 · 0 评论 -
登录后自动跳转到登录前的页面
这个需求很常见,我们浏览自己写的博客文章的时候发现有些错误,此时想修改一下,所以必须得先登录才行。点击登录按钮后跳转到登录页面,登录成功后自动跳转到之前文章所在页面。实现方法就是在登录页面通过document.referrer获取进入到此页面前的地址,然后将地址写入到隐藏的表单元素中,提交表单后地址自然就传到后台了,后台判断登录成功后跳转到传过来的地址就可以了。signin.html页面html代码原创 2017-11-04 12:18:46 · 28867 阅读 · 3 评论 -
Markdown在线预览
Markdown在线预览上线了,拖动文件或者点击上传markdown文件就可以预览了。 服务器不保存文件副本,只是将上传的文件内容转换为html格式显示在网页上。点击地址访问:3inns.cn/mdviewer前端实现支持拖拽和点击打开文件夹选择文件的方式html代码<div id="content"> <div id="dropbox"> <h1>Drop file here原创 2017-10-20 15:59:44 · 3397 阅读 · 0 评论 -
网页聊天气泡效果实现
原文链接模板收发消息模板(使用ejs),可以认为发消息在右边显示,收消息在左边显示。 每条消息有三部分组成:头像、名字、聊天内容。 头像和名字垂直布局,尖角和消息水平布局,消息整体水平布局,左边消息左对齐,右边消息右对齐,最后是调整各元素之间的间距。<script id="left-message-template" type="text/template"> <div class="l原创 2017-07-02 11:35:17 · 2506 阅读 · 0 评论 -
javascript怎么实现类似如C++函数中使用静态数据
原文链接静态数据是一些不变的数据可以多次使用而不用频繁创建,C++中通常把他们放在cpp文件的include下面,或者如果其他地方不会用到的话可以直接写在要用到的函数里面。如果是javascript的话把它直接写在函数外面就是全局变量了这个肯定是不好的,放在函数里面每次运行函数的时候都会构建这个对象对运行时是有损耗的,那应该放到哪里呢?先看C++的通常做法:// xxx.cppstatic std原创 2017-07-02 11:37:07 · 398 阅读 · 0 评论 -
qDebug日志写入本地文件
原文链接在Qt中使用qDebug打印日志信息是非常方便的,它可以直接打印Qt提供的复杂数据结构,如:QStringList,QVariantMap等。不做处理的话它只能在编辑器中打印调试信息,下面介绍将日志信息写入文件的实现方法。static struct LogWrap { LogWrap::LogWrap() { reset(); } LogWrap::~LogWrap() {原创 2017-07-02 11:38:13 · 3078 阅读 · 0 评论 -
javascript原型和继承
原文链接对象和类javascript到处都是对象,一个对象是由方法和属性(值)组成的实体(这里我们叫实例)。例如:javascript中的数组就是一个具有值的对象,同时也包括了push,reverse和pop等方法。var aArray = [1, 2, 3];aArray.push(3);aArray.reverse();aArray.pop();var length = aArray.l原创 2017-07-02 11:38:53 · 419 阅读 · 0 评论 -
bootstrap 有省略点才显示tooltip
让太长的文本显示省略点如果table中的td内容太长了可以使用省略点,给td标签增加如下类:.autocut { max-width:180px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; -icab-text-over原创 2017-06-02 09:03:46 · 4169 阅读 · 0 评论 -
CHROME开发者工具的小技巧
转载自:酷 壳 – CoolShellChrome的开发者工具是个很强大的东西,相信程序员们都不会陌生,不过有些小功能可能并不为大众所知,所以,写下这篇文章罗列一下可能你所不知道的功能,有的功能可能会比较实用,有的则不一定,也欢迎大家补充交流。 话不多话,我们开始。代码格式化有很多css/js的代码都会被 minify 掉,你可以点击代码窗口左下角的那个 { } 标签,chrome会帮你给格式化转载 2017-06-02 09:03:13 · 479 阅读 · 0 评论 -
css中position属性(absolute|relative|static|fixed)详解
转载自:脚本之家我们先来看看CSS3 Api中对position属性的相关定义static:无特殊定位,对象遵循正常文档流。top,right,bottom,left等属性不会被应用relative:对象遵循正常文档流,但将依据top,right,bottom,left等属性在正常文档流中偏移位置。而其层叠通过z-index属性定义。absolute:对象脱离正常文档流,使用top,right原创 2017-06-02 09:02:24 · 522 阅读 · 0 评论 -
Material-UI FontIcon组件使用
material-ui是一款优秀的react组件库,目前在github上Star数已经达到了25759个。其中FontIcon组件包含了900多个系统图标,但是在使用的过程中你会发现图标显示不出来,解决方法如下:到这个地址https://fonts.gstatic.com/s/materialicons/v22/2fcrYFNaTjcS6g4U3t-Y5ZjZjT5FdEJ140U2DJYC3mY原创 2017-06-02 08:59:26 · 3287 阅读 · 0 评论 -
ES6 class介绍
定义类ES6类并不是一个全新的东西:它们主要提供更方便的语法来创建老式的构造函数,javascript的类并不像其他面向对象语言C++,java中的类,这里的类只是语法糖,实际上还是基于原型链的方式。类申明定义类的一种方式是使用类的申明,为了申明一个类,你可以使用class关键字空格后接一个名字。class Rectangle { constructor(width...原创 2018-02-19 08:55:00 · 602 阅读 · 0 评论