一.前言 上午把近日用React做的一个新闻项目所依赖的包升级到了最新的版本,其中从react-router(2.8.1)升级到react-router(4.1.2)中出现了很多问题, 故总结一下在升级过程中遇到的问题. 二.react-router,V4版本修改内容 1. 所有组件更改为从react-router-dom导入 之前的所有路由组件均是从react-router中导入,在我之前的项目中,导入相关组件如下: //v2 import {Router,Route,hashHistory} from react-router;在react-router4 开始,所...
前言 大家应该都知道，Webpack 是一个前端资源加载/打包工具。它将根据模块的依赖关系进行静态分析,然后将这些模块按照指定的规则生成对应的静态资源。因为最近在对博客做SSR，无奈vue ssr demo或例子都是基于webpack2的。博主在webpack1.x上折腾了许久，vue-ssr-server-bundle.json文件生成仍然还是遥遥无期。最后还是乖乖地开始了webpack升级之旅。 本文主要记录升级过程中遇到的一些坑和解决办法，可能有些遗漏了，能记多少记多...
前言 在官方介绍里有这么一句话： Yarn is a package manager for your code. It allows you to use and share code with other developers from around the world. Yarn does this quickly, securely, and reliably so you dont ever have to worry. 关键意思就是，快速,安全,可靠。你下载的包将不再重新下载。而且确保在不同系统中可以正常工作。 yarn的使用 yarn包管理工具，官网说是快速、可靠、安全的依赖管理，尝试了一下，入...
jQuery事件日历插件e-calendar，支持针对指定日期自定义日程安排（无条数限制），设置过日程的日期会高亮显示，兼容IE7+主流浏览器。 原版使用方法及演示地址:e-calendar原版 (鼠标移动到天显示当天的日程安排)升级版介绍: 1.同一天可存在多个事件交集 2.点击天在日历下方出现日程列表 3.点击日程列表可添加其事件 。 4.添加item-grid的显示和隐藏 5.Events中数组集合可添加id，type等元素(区分日程类型：任务类型或日程类型) 6.增...
jQuery绑定自定义事件 首先让我们来看看jQuery绑定自定义事件的使用方法，你可以使用bind或者live来订阅一个事件（当然1.7以后也可以使用on了），代码如下： $("#myElement").bind(customEventName,function(e){ ... }); $(".elementsClass").live(customEventName,function(e){ ... });然后通过如下方式来触发事件： $("#myelement").trigger(customEventName);或者你也可以为自定义事件增加额外的参数，样例如下： $("#myelement...
本文实例讲解了JavaScript 实现彩票中随机数组的获取详细代码，分享给大家供大家参考，具体内容如下 效果图：具体代码： <!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>Math.random方法彩票随机数的生成-升级版</title><style type="text/css">*{margin: 0;padding: 0;}.wrap{width: 600px;height: 300px;background-color: #f8e2e2;margin: 0 auto;}.list{width: 440px;/*border: 1px solid red;*/margin...
背景-------------------------------------------------------------------------------- jQuery想必各个web工程师都再熟悉不过了，不过现如今很多网站还采用了很古老的jQuery版本。其实如果早期版本使用不当，可能会有DOMXSS漏洞，非常建议升级到jQuery 1.9.x或以上版本。前段时间我就主导了这件事情，把公司里我们组负责的项目jQuery版本从1.4.2升级到了jQuery 1.11.3。jQuery官方也为类似升级工作提供了jQuery Migrate插件。言...
node有一个模块叫n（这名字可够短的。。。），是专门用来管理node.js的版本的。 首先安装n模块： npm install -g n第二步： 升级node.js到最新稳定版 n stable 是不是很简单？！ n后面也可以跟随版本号比如： n v0.10.26 或 n 0.10.26 就这么简单，这可怎么办？？！！ 另外分享几个npm的常用命令 npm -v #显示版本，检查npm 是否正确安装。npm install express #安装express模块npm install -g express #全局安装expre...
以前写的分页用了好久了，但是分页时除了传页面外有时还要传一些其它参数，以前操作时要把传的参数放到隐藏hidden中，分页时在取出来，这样比较麻烦，今天无事，重新包装了一下 直接上代码吧 css用了bootstrap中分页的样式.pagination-lg > li:first-child > a, .pagination-lg > li:first-child > span { border-bottom-left-radius: 6px; border-top-left-radius: 6px; }.pagination-lg > li:last-child > a, .pagination-lg > l...
鉴于网上找到的几个日期选择程序有些问题，遂着手重写一个程序，大部分还是借鉴前人的代码，添加了时间选择功能，隐藏会遮挡控件的标签select，object。 开始本想使用window.createPopup()来弹出日历的选择，这样就可以跨过任何标签。 不过做到中途发现用createPopup窗口实现理论上是行不通的： 一是因为不在窗体里单击任何地方都会关闭窗口，而当用下拉框选择年份时，很有可能会单击到窗体外的地方，当然这个可以自己写select来避...
主要的变化点有：把‘下一条'、‘上一条'的click事件抽象到一个函数showNext中。添加setInterval，添加selector元素的hover事件。好了，我们一个个的看。 showNext函数： 代码如下://显示函数 function showNext(flag) { //隐藏导航 $(config.selector).find(a).css(display, none); //创建遮罩 $.tranzify.createOverlay(config); //获取当前显示状态的图片 var currImg = $(. + config.visibleClass, $(config.selector)); if (...
这个时间组件以前发过一次,上次那个很烂,这次有时间了,把这个升级了,性能更好,完美兼容所有浏览器,ie6下拉select档不住的问题 也解决了.总之,差不多也算一个完美的时间组件, 在线demo nothingDemo 突然发现下面的代码里面有个运行代码可以看在线demo,就再最下面 然后贴出源码,只有一点简单的说明 代码如下:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional...
这次还是利用原来代码的组织结构重新加强了功能，目前来说还有两个小问题，第一个是ie6下自定义弹出层会出现无法遮住select的情况，目前还没加入到组件里，可以自己在自定义的div里面加上ifame来遮罩，组件自带的弹出层可以遮住。第二个问题，由于是绝对定位，所以在改变浏览器窗口大小的时候会出现无法自动跟随。大家试试就知道了，当然问题肯定不少，只是这两个我认为比较重要的，暂时列出来，以后修复。 下面是代码，里面都有注...
对不兼容处的修改： 1. jQuery("option[selected=true]",this) 改为 jQuery("option:selected",this) 2. jQuery("option[text=text]",this) 改为 jQuery("option:contains(text)",this)
下面的效果，只能在IE6下才能看到效果。判断IE版本并给出提示升级浏览器 #ie6-warning{ background:rgb(255,255,225) url("/upload/201006/20100628012515690.gif") no-repeat scroll 3px center; position:absolute; top:0; left:0; font-size:12px; color:#333; width:97%; padding: 2px 15px 2px 23px; text-align:left; } #ie6-warning a { text-decoration:none; } 您正在使用 Internet Explorer 6，在本页面的显...