前段时间做了一个移动端spa项目，技术基于 :vue + vue-router + vuex + mint-ui因为使用了vue-cli脚手架的webpack模版，所有页面都以.vue为后缀的文件作为一个组件最近公司项目比较少终于有空来记录一下自己对vue-router的一些小小的使用心得， 一般的移动端口单页应用在跳转页面时候会有相应的转场动画，比如： 1. 从当前一级页面跳转二级页面需要展示的转场动画是一级页面向屏幕左边移动消失的同时， 二级页面从屏幕的...
这次给大家带来如何使用v-model与promise两种方式实现vue弹窗组件，使用v-model与promise两种方式实现vue弹窗组件的注意事项有哪些，下面就是实战案例，一起来看一下。最近公司有一个后台业务虽然也是写在了现有的后台系统中，但是之后要为这个业务单独拉出来新建一个后台系统,所以现有的后台系统中的vue组件库，就不能用了(因为不知道将来的系统要基于什么组件库，以防给未来移植项目带来麻烦),这次业务中又遇到了弹窗的功能,所以...
这次给大家带来Vue.js实现可配置登录表单步骤详解，Vue.js实现可配置登录表单的注意事项有哪些，下面就是实战案例，一起来看一下。业务场景在之前，项目只支持手机号+密码登录，前端是直接把表单写死的，后来有客户希望能支持验证码登录，有的客户还希望能有手机号+验证码+密码的登录方式…所以登录方式的灵活性需要可配置的表单支持，于是我把登录组件做了拆分。 以表单元素为粒度，分离出了手机号、密码、短信验证码这几个组件，...
前面的话 本文将使用NodeJS实现较复杂应用的路由功能 结构项目结构如下代码如下 功能【router.js】 // 加载所需模块 var http = require(http); var url = require(url); var fs = require(fs);var host = 127.0.0.1; var port = 8080;http.createServer(function(req,res){var pathname = url.parse(req.url).pathname;console.log(Request for + pathname + received.);function showPaper(path,status){var content = fs.read...
这篇文章主要介绍了jQuery基于cookie实现换肤功能,结合具体实例形式分析了jQuery使用cookie记录与读取用户信息实现页面样式的操作方法,对jQuery感兴趣的朋友可以参考下本篇文章本文实例讲述了jQuery基于cookie实现换肤功能。分享给大家供大家参考，具体如下：换肤，在你使用QQ、浏览器、酷狗等软件时，总是能看到这两个字(也有叫皮肤)。不过换肤的确能解决很多人的口味，换肤看似一个无关紧要的功能，但其实能起到吸引用户的作用。...
本文给大家分享一段jquery代码实现滑动按钮开关的效果，代码简单易懂，非常不错，具有一定的参考借鉴价值，需要的的朋友参考下滑动开关按钮大家在各大网站都能见到，下面给大家分享一篇基于jquery实现的一个滑动按钮开关效果，感兴趣的朋友可以参考下实现代码。先给大家展示下效果图：代码：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>jquery做的滑动按钮开关</title> <link rel="stylesheet" t...
当点击顶部按钮的时候，执行方法,scrollTop属性获取选中标签距滚动条的距离，当点击底部标签时候，执行方法，其中offset()获取匹配元素在当前视口的相对偏移Untitled Page$(document).ready(function () { //当点击顶部按钮的时候，执行方法,scrollTop属性获取选中标签距滚动条的距离。 $('#top').click(function () { $('html').animate( { scrollTop: '0px' }, 1000 ); }); //当点击底部标签时候，执行方法，其中offset()获取匹配...
本文实例讲述了jQuery实现鼠标经过时出现隐藏层文字链接的方法。分享给大家供大家参考。具体如下： 这里演示Jquery显示隐藏层的方法，鼠标经过时出现文字链接，模拟评分效果，这里没有加动作，仅显示了前台效果的实现。 运行效果截图如下：在线演示地址如下： http://demo.jb51.net/js/2015/jquery-mouse-over-show-txt-demo/ 具体代码如下： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/...
最近在做小程序的登录，需要同时获取用户手机号和头像昵称等信息，但是小程序又不支持单个接口同时获取两种数据，因此想到自定义一个弹窗，通过弹窗按钮触发获取手机号事件。记录一下。具体代码如下： 业务代码中：在业务代码中引入dialog组件即可 <dialog visible="{{dialogVisible}}" showFooter="{{footerVisible}}" title="测试一下"><view class=dialog-body slot="dialog-body"><view class=dialog-content>申请获取你微信绑...
本文实例讲述了jQuery实现文本显示一段时间后隐藏的方法。分享给大家供大家参考，具体如下： 点击button时，提示信息显示，8秒后，信息隐藏。 <input id="place_order" name="place_order" type="submit" /> <div class="after_submit_remind" style="display: none;">请耐心等待，这段文本显示8秒后会消失，安拓网络。 </div> jQuery(document).ready(function(){jQuery(document).on(click, input#place_order, function(){jQuer...
摘要：最近在项目中要做一个图片预览的功能，这时候会遇到用户上传很大的图片，已经超出视图界面。最终决定做一个在固定宽和高的位置，用户可以拖动图片查看。所以自己就写了一个支持ie5+，chrome，Firefox，opera等浏览器的可拖动dom元素的插件。 实现这个功能所需要的知识点不多，如下： 1、js中element.style.left style.left返回的变量是个字符串，是个可改变量 js中element.offsetLeft offsetLeft返回的是个int类型，不...
本文实例讲解了javascript实现表单验证的详细代码，分享给大家供大家参考，具体内容如下 效果图：具体代码： <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> </head> <script type="text/javascript"> function check() { //真实姓名(不能为空，其它没有要求) var name = document.getElementById("name").value; if(name==""||name==null) { alert("不能为...
首先需要datagrid editor对combogrid的扩展，这个是别人实现的：$.extend($.fn.datagrid.defaults.editors, { combogrid: { init: function (container, options) { var input = $('').appendTo(container); input.combogrid(options); return input; }, destroy: function (target) { $(target).combogrid('destroy'); }, getValue: function (target) { return $(target).combogrid('getValue'); }, setValue: function (target,...
基于Vue的页面切换左右滑动效果，具体内容如下HTML文本页面： <template><div id="app><transition :name="direction" mode="out-in"> <!--动态获得transition 的name值--><router-view class="app-view" wechat-title></router-view></transition></div> </template>JS定义代码：定义在全局js文件里面 router.beforeEach((to, from, next) => {const list = [home, group, user] // 将需要切换效果的路由名称组成一个数组const t...
本文实例讲述了jQuery实现向下滑出的平滑下拉菜单效果。分享给大家供大家参考。具体如下： 这里演示的jQuery向下滑出的下拉平滑菜单，可添加多个菜单选项，修改起来比较灵活的下滑菜单，颜色风格自己可修改，不多介绍了，感兴趣的运行一下代码看效果。 运行效果截图如下：在线演示地址如下： http://demo.jb51.net/js/2015/jquery-xlph-menu-codes/ 具体代码如下： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN...