antd preventDefault 自己控制行为

AntD框架的upload组件上传图片时使用customRequest方法自定义上传行为

本次做后台管理系统,采用的是 AntD 框架.涉及到图片的上传,用的是AntD的 upload 组件. 我在上一篇文章<AntD框架的upload组件上传图片时使用customRequest方法自定义上传行为>中讲到:AntD 的 upload 组件有很多坑. 今天这篇文章,我们继续来研究 AntD 的 upload 组件的另一个坑. 备注:本文写于2020-06-11,使用的 antd 版本是 3.13.6. 使用 AntD 的 upload 组件做图片的上传,效果演示因为需要上传多张图片

ngRoute AngularJs自带的路由

ngRoute $routeProvider 配置路由的时候使用. 方法: when(path,route); 在$route服务里添加一个新的路由. path:该路由的路径. route:路由映射信息. controller:字符串或函数,指定控制器. controllerAs:一个用于控制器的标识符名称.. template:字符串或函数,html模板. templateUrl:字符串或函数,html模板的地址. resolve:对象,一个应该注入控制器的可选的映射依赖关系.如果任何一个依赖

js高仿QQ消息列表左滑功能

该组件,主要功能类似于QQ消息列表左滑出现删除.标为已读等按钮的功能:现在的版本用的是纯javaScript编写:后续会跟进 angularJs 开发的类似组件以及jquery的; 下面,就让我们来认识下怎么使用该程序: 在该程序里,总共分为四个文件: 1 .css文件夹 2. img 图片文件夹 3. js文件 4. index.html 主页面: 稍后,你可以自行下载,打开运行观看效果: 二.代码讲解 1.此html结构,为不可修改结构 <ul class="list-ul"

js限制input只能输入有效的数字，有且只有一个小数点，第一个不能为小数点-备

<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script src="js/jq.js"></script> </head> <body> <input type="text"

【jQuery、原生】键盘键入两位小数

jquery的处理办法 <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script src="jquery.min.js"></script> </head> <body> <input typ

Angular - - ngRoute Angular自带的路由

ngRoute $routeProvider 配置路由的时候使用. 方法: when(path,route); 在$route服务里添加一个新的路由. path:该路由的路径. route:路由映射信息. controller:字符串或函数,指定控制器. controllerAs:一个用于控制器的标识符名称.. template:字符串或函数,html模板. templateUrl:字符串或函数,html模板的地址. resolve:对象,一个应该注入控制器的可选的映射依赖关系.如果任何一个依赖

JS笔记-强化版2

1.DOM: DOM : Document Object Model 文档对象模型文档:html页面文档对象:页面中元素文档对象模型:定义为了能够让程序(js)去操作页面中的元素 DOM会把文档看作是一棵树,同时定义了很多方法来操作这棵数中的每一个元素(节点)DOM节点(document-html-(head.body)..) getElementById getElementByTagName document document.body 1)childNodes 不推

自己编写jQuery插件之Tab切换

自己编写jQuery插件之 Tabs切换 jquery ui 带有Tabs切换插件,但其css样式太难维护,引用的东西太多,因此就自己写了个. 起初我Html代码架子是这样的: <div class="tabs"> <ul> <li class="acss" data-box="#panel-1">标签1</li> <li class="bcss" data-box=&qu

React+Antd+Antd-Img-Crop实现上传固定大小的裁剪头像或者图片（且可控制图片数量）

见章知著 1024,程序员们节日快乐!本文主要讲述react配合antd以及react-img-crop第三方库实现一个可控的图片上传功能. 运行项目需要具有node环境第三方库安装 1.antd(Upload)安装和初始化 1.1.在代码编辑器(VS-Code或者其他编辑器)代开终端,输入命令行安装antd: $ yarn add antd --save 或者 $ npm install antd --save 1.2.安装好antd后,修改src/App.css,在新建的项目中引入ant

create-react-app 搭建的项目中，让 antd 通过侧边栏导航 Menu 的 Menu.Item 控制 Content 部分的变化

第一种:BrowserRouter把Menu和Route组给一起包起来 <Router></Router> 标签要把Menu和Route组给一起包起来修改src/index.js文件,相应内容如下: import {BrowserRouter} from 'react-router-dom' ReactDOM.render(<BrowserRouter><App /></BrowserRouter>, document.getElementBy

antd踩坑：日期选择器的可选日期控制的问题

有一个需求是日期选择需要加一个日期限制. 于是我兴高采烈的加上去了. // 日期可选判断方法 disabledDateFunc = current => { const { disabledDateArray } = this.state; if (disabledDateArray) { return ( current && (current < disabledDateArray[0] || current > disabledDateArray[1]) ); }

react引用antd的form表单

引用form是第三方插件ant插件,官网网址:https://ant.design/.用到的antd的版本是@2.0.1.form(https://ant.design/components/form/)表单页面的大概样子如下:

使用antd UI 制作菜单

antd 主页地址:https://ant.design/docs/react/introduce 在使用过程中,不能照搬antd的组件代码,因为有些并不合适.首先,菜单并没有做跳转功能,仅仅是菜单,需要在它的基础方法中添加我们的业务代码. /*菜单组件,所有的方法都要bind this*/ import React,{Component} from 'react'; import {render} from 'react-dom'; import {Link,browserHistory} f

移动端框架篇-控制子容器的滑屏框架-fullPage.js

控制子容器法方法是只显示其中一个子元素,其它隐藏,滑屏时隐藏当前元素,并显示当前元素的下一个同辈元素~ 这里采用fullPage框架,库大小7.69K~ fullPage框架的页面样式无需自定义,已有写好的兼容ios5+.android2.3+.winphone 8系统,其滑屏功能,效果比较丰富,支持缩放.旋转.透明度.自动滑屏等动画效果~如果你需要设计精彩的滑屏效果,可考虑它~ fullPage框架更多详细的功能猛击这里https://github.com/powy1993/fullpag

nw.js FrameLess Window下的窗口拖拽与窗口大小控制

nw.js FrameLess Window下的窗口拖拽与窗口大小控制很多时候,我们觉得系统的Frame框很难看,于是想自定义. 自定义Frame的第一步是在package.config文件中将frame选项设置为false. { "name": "1", "main": "index.html", "nodejs": true, "single-instance": false, &

Web应用程序系统的多用户权限控制设计及实现-页面模块【9】

前五章均是从整体上讲述了Web应用程序的多用户权限控制实现流程,本章讲述Web权限管理系统的基本模块-页面模块.页面模块涉及到的数据表为页面表. 1.1页面域为了更规范和方便后期系统的二次开发和维护,对应特定的业务模块采用Area(域)的方式开发,页面模块的开发域如下图所示:

Web应用程序系统的多用户权限控制设计及实现-栏目模块【8】

前五章均是从整体上讲述了Web应用程序的多用户权限控制实现流程,本章讲述Web权限管理系统的基本模块-栏目模块.栏目模块涉及到的数据表为目录表. 1.1栏目域为了更规范和方便后期系统的二次开发和维护,对应特定的业务模块采用Area(域)的方式开发,栏目模块的开发域如下图所示:

Web应用程序系统的多用户权限控制设计及实现-用户模块【7】

前五章均是从整体上讲述了Web应用程序的多用户权限控制实现流程,本章讲述Web权限管理系统的基本模块-用户模块.用户模块涉及到的数据表为用户表. 1.1用户域为了更规范和方便后期系统的二次开发和维护,对应特定的业务模块采用Area(域)的方式开发,用户模块的开发域如下图所示:

THREE.js代码备份——线框cube、按键、鼠标控制

<!DOCTYPE html> <html lang="en"> <head> <title>three.js canvas - geometry - cube</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, user-scalable=no,

js控制TR的显示影藏

在很多现实的场景中,有的文本框我们希望在选择“是”的按钮之后才出现,这就需要js控制TR的隐藏和显示,(div的影藏显示类似) 以下是一段选择是的按钮就显示身高和体重的文本框的代码.注意:ready方法必须要引用jquery的库. 1.html Code <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <

H5 音频标签自定义样式修改以及添加播放控制事件

说明: 需求要求这个音频标签首先要是可适配移动端浏览器的,音频样式就是参考微信做的. 最终效果如下: 具体实现思路: H5 的 <audio> 标签是由浏览器负责实现默认样式的.所以不同的浏览器样式不一样,有些还不太美观.所以我们一般会去掉默认样式,自己重新写.具体操作是定义 <audio> 的时候去掉 controls 属性,这样就可以隐藏原生的 audio, 然后就可以加上自己写的 html + css 代码了.最后用 js 捕获 audio 对象,为它添加各种播放控制事件.

巴特西