WEB前端
关注
分享
扫一扫
majinbo111
这个作者很懒，什么都没留下…
展开
-
js中~~和 | 的妙用
原文：http://www.fly63.com/article/detial/2802双~的用法~~它代表双非按位取反运算符，如果你想使用比Math.floor()更快的方法，那就是它了。需要注意，对于正数，它向下取整；对于负数，向上取整；非数字取值为0，它具体的表现形式为：~~null; // => 0~~undefined; // => 0~~Infinity; // => 0--NaN; // => 0~~0; // =.转载 2020-08-16 14:31:25 · 320 阅读 · 0 评论 -
vue elementUI el-table 合并列 span-method 兼容safari
实现效果效果描述：把最后一列的“操作”列的【编辑】按钮合并为一个展示兼容safari的写法objectSpanMethod({ row, column, rowIndex, columnIndex }) { if (columnIndex === 3) { //第4列 if (rowIndex === 0) { return { rowspan: 7, colspan: 1 }; } els原创 2020-08-16 14:24:07 · 547 阅读 · 0 评论 -
React antd Upload限制上传类型
<Upload name="file" className="uploader" listType="picture-card" showUploadList={false} accept=".xls, .xlsx" beforeUpload={this.beforeUpload.bind(this)}>可以直接利用后缀名限制，如下# 仅能上传execl 文件accept=".xls, .xlsx"# 仅能上传图片文件ac原创 2020-08-07 10:28:16 · 9353 阅读 · 0 评论 -
React onChange(value) 传入值是字符串
案例：实时获取输入框且精度保留两位数的小数求和并展示React onChange(value)的坑 onChange(value) { //无错误执行 console.log(value); //注意此处的值是字符串类型 //如果用户输入2.00，用户删除到“2.”的，执行下边的值就会报错 //VM663:1 Uncaught TypeError: a.toFiexed is not a function console.log(value.toFixed(2)); //因为js原创 2020-08-06 12:15:19 · 1106 阅读 · 0 评论 -
react antd Form.List Form.Iterm Checkbox.Group的案例
邮件订阅交易报表流水import React from "react";import { inject, observer } from "mobx-react";import { withRouter } from "react-router-dom";import {Input, Button, Checkbox, Form, Skeleton} from "antd";import addIcon from '@ASSETS/images/icon/add.png';import subI原创 2020-07-20 11:22:33 · 4160 阅读 · 0 评论 -
学习Vue子组件操作父组件（emit）
<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <title>vue learning</title></head><body> <div id="app"> <ol> <!-- 现在我们为每个 todo-ite原创 2020-06-17 10:55:07 · 315 阅读 · 0 评论 -
HTML fieldset 标签
原文：https://www.w3school.com.cn/tags/tag_fieldset.asphtml fieldset神奇的边框上带文字的实现：<!DOCTYPE HTML><html><body><form> <fieldset> <legend>健康信息</legend> 身高：<input type="text" /> 体重：<input typ.转载 2020-06-12 18:55:24 · 332 阅读 · 0 评论 -
flex 布局骰子
dice.scss.main { width: 100%; height: 100%; display: flex; -webkit-display: flex; flex-direction: row; justify-content: space-around; align-items: center; // justify-content: center; vertical-align: center; flex-wra原创 2020-06-09 15:40:26 · 268 阅读 · 0 评论 -
JavaScript Array 方法总结
JavaScript Array some() 方法定义和用法some() 方法用于检测数组中的元素是否满足指定条件（函数提供）。some() 方法会依次执行数组的每个元素：如果有一个元素满足条件，则表达式返回true , 剩余的元素不会再执行检测。如果没有满足条件的元素，则返回false。注意： some() 不会对空数组进行检测。注意： some() 不会改变原始数组。var a...原创 2020-04-25 23:34:31 · 183 阅读 · 0 评论 -
vue 内部使用axios需注意this的使用
vue 内部使用axios需注意this的使用共有三种写法，注意 第一种的坑！！！<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Pay attention to this when using Axios in Vue.<...原创 2020-04-15 21:39:14 · 1479 阅读 · 0 评论 -
html邮件内容兼容主流邮箱的编写规则
邮件分类：第一类，邮件内容布局在整个邮箱的某个div中，如gmail、hotmai、sohu等。第二类，邮件内容布局在独立的iframe中，如163、sina等。Html编写规则：不写style标签，仅用内联样式，不要使用主流的css3样式，因为不同邮件的兼容性很差少用图片，邮件需获得许可才可以打开图片，没有载入会很丑内联样式里的float、position属性会被过滤，outl...原创 2020-04-01 23:00:43 · 1271 阅读 · 0 评论 -
button 默认类型是submit
“form表单里的按钮，明明是button而不是input type = submit，点击还是提交，如何让它不提交？” （这个问题被我遇到了，很坑爹的，知道了就不以为然了。） 因为 button 默认类型是submit，所以如果想让不提交，显示的指定类型，type=“button”就解决了。证明文档：https://www.w3.org/TR/2011/WD-html5-20110525/th原创 2016-07-27 20:30:30 · 4368 阅读 · 0 评论 -
bootstrap 表格怎么把纵向展示的变成横向的呢？
使用bootstrap 布局，展示的效果竟然是纵向的，想要横向怎么弄呢？跟table 加一个样式限制就可以了：style="text-overflow: ellipsis; #文本溢出会截断处理，末尾上加...white-space: nowrap; #表示不换行overflow: hidden;"; #内容会被修剪，并且其余内容是不可...原创 2018-07-31 18:01:25 · 11787 阅读 · 0 评论 -
Jquery 闭包概念
https://www.cnblogs.com/dewin/archive/2010/06/17/1759477.html待做转载 2019-01-10 23:28:05 · 623 阅读 · 0 评论 -
JS - 实现日期的格式化输出
背景有时我们需要在 javascript 中对日期进行格式化，将其转换成固定格式的字符串。网上有许多现成的 JS 日期库可以使用，其实不借助这些库我们也可以自己实现。对Date进行扩展为方便我们对日期（Date）进行格式化输出，先对 Date 进行扩展，增加 format 方法。以后调用 Date 对象的 format 方法即可将日期转换成我们指定格式的字符串（String）。Date.p...转载 2019-03-21 17:05:21 · 10016 阅读 · 0 评论 -
The difference between this and $(this) in Jquery
Content$()this$(this)Reference$()$() , It’s jquery selectors.The selector allows you to manipulate groups of HTML elements or individual elements.In HTML DOM terminology:The selector allows you t...原创 2019-05-28 11:54:59 · 151 阅读 · 0 评论 -
Jquery FormData upload image file
ContentFor exampleHTMLJSReferenceFor exampleHTML<div class="form-group"> <label class="col-sm-3 control-label">图片</label> <div class="col-sm-4"> <input type=...原创 2019-05-28 12:05:49 · 512 阅读 · 0 评论 -
AJax commit json and PHP receive json
ContentAJaxPHPReferenceAJax<script type="text/javascript">var data = { id:"1"; name:"test";};$.ajax({ url:'/api.php?action=edit', type:'POST', ...原创 2019-06-04 11:25:36 · 211 阅读 · 0 评论 -
webpack 起步
概念官方解释：本质上，webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)。当 webpack 处理应用程序时，它会递归地构建一个依赖关系图(dependency graph)，其中包含应用程序需要的每个模块，然后将所有这些模块打包成一个或多个 bundle。自我理解：webpack 用于管理资源（css，js，图标，字体等），解决依赖...原创 2019-08-28 15:58:06 · 277 阅读 · 0 评论 -
webpack 错误 Module build failed (from ./node_modules/css-loader/dist/cjs.js): CssSyntaxError
npm run build> webpack_test@1.0.0 build /home/q/www/webpack_test> webpackHash: e5a0c99f86239b7fee98Version: webpack 4.39.3Time: 345msBuilt at: 08/30/2019 7:13:18 PM 1 assetEntrypoint a...原创 2019-08-30 19:22:09 · 48520 阅读 · 2 评论 -
ubuntu 18.04 npm install 遇到的pngquant-bin 问题
遇到的问题npm install> pngquant-bin@4.0.0 postinstall /var/www/tax_client/node_modules/pngquant-bin> node lib/install.js ⚠ The `/var/www/tax_client/node_modules/pngquant-bin/vendor/pngquant` b...原创 2019-09-26 11:48:09 · 13276 阅读 · 0 评论 -
Jquery 增加新元素导致老元素被重复绑定同样的事件
核心代码就是解绑之前的事件，再重新绑定：//解帮self.$wxAdd.off();self.$wxDel.off();self.$wxChildAdd.off();self.$wxChildDel.off();全代码var wxList = { init:function() { this.build(); ...原创 2018-06-11 14:49:49 · 546 阅读 · 0 评论 -
除了jsonp 跨域外还有CROS
http://www.ruanyifeng.com/blog/2016/04/cors.html转载 2018-04-23 21:27:35 · 677 阅读 · 0 评论 -
Jquery hide、show、fadeIn、fadeOut 竟然可以延迟
jQuery hide() 和 show()通过 jQuery，您可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素：$("#hide").click(function(){ $("p").hide();});$("#show").click(function(){ $("p").show();});亲自试一试 语法：$(selector).hide(speed原创 2017-02-09 11:55:08 · 5476 阅读 · 0 评论 -
jquery 实现输入字符给出建议列表&实现上下键切换选项
输入框键入字符时给出建议列表1、html 一个 input（输入框） 与 ul（建议列表） 的组合 2、监听输入框的内容“oninput()”，根据内容给出建议列表展示 3、建议列表 要做强大一些，建议使用AJax访问一个内容丰富的接口以上是简单的任务分解，实现起来比较简单的输入框监听上下键且切换选项1、监听输入框的按键keydown事件 2、判断上(e.keyCode:38)下(e.keyC原创 2017-02-06 19:48:24 · 2096 阅读 · 0 评论 -
监听keyup 和keydown 事件
keyuphttp://www.w3school.com.cn/jquery/event_keyup.asp触发 keyup 事件语法$(selector).keyup()将函数绑定到 keyup 事件语法$(selector).keyup(function)keydownhttp://www.w3school.com.cn/jquery/event_keydown.aspkeydown 类似k原创 2017-02-06 18:04:52 · 4983 阅读 · 0 评论 -
jquery1.6之后的.prop()和.attr()异同
最大区别使用如下图： 细节详见：http://hxq0506.iteye.com/blog/1046334原创 2017-01-03 20:44:33 · 366 阅读 · 0 评论 -
优化页面加载速度
1、要给相应的图片做懒加载 2、如果页面模块太多，也不适合全部放在页面，建议有请求时去加载对应的模块，这样也可节省一些的带宽 3、以上的优化要跟进具体的环境去优化，比较原创 2016-01-06 11:32:50 · 391 阅读 · 0 评论 -
Jquery常用操作方法
(…).hide();隐藏选择选中的元素(…).hide(); 隐藏选择选中的元素 (…).show(); 显示选择选中的元素 (…).addClass(…);给指定的元素加样式(…).addClass(…); 给指定的元素加样式 (…).removeClass(…); 给指定的元素移除样式 $(function()){…} 这个表示页面加载完之后执行那些Jquery内容原创 2015-11-03 11:53:22 · 346 阅读 · 0 评论 -
炫酷的滑动效果
炫酷滑动效果原创 2015-10-29 20:22:13 · 882 阅读 · 0 评论 -
select 标签的使用
select 标签的使用原创 2015-09-21 16:40:48 · 517 阅读 · 0 评论 -
jquery绑定事件注意问题
1、jquery 的选择器 绑定事件何时生效呢？ dom加载完时，jquery 对页面里的选择器选中的元素绑定事件，但不会作用与新增同类选择器的元素。原因是 dom结构的js仅执行一次。 2、如何避免新增同类选择器元素绑定的事件不生效呢？ 解决新增与原来的同类选择器元素具有同样的绑定事件，简单粗暴的方式就是给新增同类选择器的元素重新绑定事件。原创 2017-02-15 11:14:36 · 514 阅读 · 0 评论 -
svg 画轨迹图
学习网站 http://www.w3school.com.cn/svg/svg_reference.asp 参考案例 http://v3.faqrobot.org/hvb/demos/heartImg/demo.html http://www.alloyteam.com/2017/02/the-beauty-of-the-lines-break-lines-svg-animation/原创 2017-03-09 10:23:20 · 4090 阅读 · 0 评论 -
h5视频播放
h5 嵌入视频的一些基础总结：http://www.xuanfengge.com/html5-video-play.html原创 2017-03-24 10:15:10 · 871 阅读 · 0 评论 -
jquery的一种新写法
之前写法都觉得太低端了，不过不否认哈，毕竟javasrcipt都是识别的，习惯罢了。$(function(){ var activityClass = { init:function() { this.build(); this.clear(); this.initEvent(); ...原创 2018-04-09 12:10:05 · 357 阅读 · 0 评论 -
CSS 设置背景图跟容器一样大
class=”zt-title”的div想放一张背景图，怎么才能充满容器呢？<div class="zt-title"> <h2 class="title">热卖推荐</h2> <p class="desc"></p></div>不多废话，上干货：&原创 2018-03-14 21:10:50 · 6789 阅读 · 1 评论 -
lebal 标签的 for 属性用法
<!DOCTYPE html><html><head><meta charset="utf-8"><title>label for</title></head><body><form><label id="myLabel" for="male">Male</label><input type="radio" name="sex" id="male" value="male"><br原创 2017-12-19 15:10:17 · 1379 阅读 · 0 评论 -
jquery 判断元素是否在数组内
js 方法：var arr = ["a", "b", "c"];// js arr.indexOf("c")var result1 = arr.indexOf("c"); //返回index为2,失败返回-1jquery 方法：var arr = ["a", "b", "c"];// jquery $.inArray("c", arr)var result = $.inArray("c",原创 2017-11-26 12:56:25 · 6558 阅读 · 0 评论 -
Jquery 获取某个样式除第一个以外的元素
:not(:first) 非第一个原色:not(.test) 非$('.test')以外的元素原创 2017-11-26 15:33:09 · 17341 阅读 · 0 评论 -
mustache template
<html><head><meta charset="utf-8" /><title></title></head><body><div id="tpl"></div><script type="text/javascript" src="http://twitter.github.io/hogan.js/builds/3.0.1/hogan-3.0.1.js"></script><原创 2017-08-04 14:50:14 · 524 阅读 · 0 评论