彩笔_小qing-CSDN博客

原创 border-style:groove/ridge/double/inset/outset

<p></p>1.ridge p{ width: 200px; height: 200px; border-width: 3px; border-style: ridge; border-color: #faf;}2.groove p{ width: 200px; height: 200px; border-wid

2017-05-19 14:17:51 3694

原创怎么判断一个object是否是数组(array)？

方法一function isArray(obj){ return Object.prototype.toString.call(obj) === '[Object Array]';}使用call来使 toString 中 this 指向 obj方法二function isArray(obj){ return obj.__proto__ === Array.prototype;}

2017-05-19 09:06:41 3473

原创 js清空数组

var arr = ['a','b','c','d','e'];方法一arr = [ ]; 方法二arr.length = 0;方法三arr.splice(0,arr.length);

2017-05-19 08:53:37 1059

原创 bootstrap表格内容过长时用省略号表示

首先，bootstrap中当td内容超过我给的固定宽度时，省略号代替的代码如下：<table class="table table-bordered"> <thead> <tr> <th class="center" style='width:38%;'>商品名称</th> <th class="center

2017-05-17 16:04:54 35865 1

原创实时预览上传图片(QQ上传头像前的预览)

上传到服务器之前的本地预览，提高响应速度，用户交互友好<div id="preview"></div><input type="file" onchange="preview(this)" />function preview(file) { var prevDiv = document.getElementById('preview'); if (file.files &&

2017-05-16 15:57:31 918

转载 js代码段3：限制只能输入数字（兼容）

1.HTML5对于ie10以下浏览器，此处并不好使。不支持HTML5。第一种 <input type="number" />第二种<input type="text" pattern=[0-9] /> 但是在IE兼容模式下并不生效。2. 使用JavaScript<input type="text" name="number" id="filter">function clearNoNumber

2017-05-16 14:22:11 721

原创 JS代码段2：禁用文本框input的几种方法

我们都知道，禁用文本框有个很简单的方法，表单元素有特性是用来控制禁止使用的。<input type="text" class="phone" disabled>说实话这个自带属性并不美观吧。。。当然，表单还有一个特性也可以控制它被禁用<input type="text" class="phone" readonly>比disabled美观多了，美观多了呀，可以自定义背景颜色的对吧今天还要说

2017-05-16 10:41:38 4967

转载 js代码段1：去掉文本框前后的空格（JS+JQuery）

表单验证时，需要去除文本框前后的空格才可以正确通过验证。以前看到过一句话：任何设计和代码都要对用户足够宽容。<input type="text" class="phone"><input type="button" id="btn" value="过滤">jQuery - $.trim()var tel = $('.phone').val();var result = $.trim(tel);

2017-05-16 10:14:02 1223

原创移动端开发：使用搜索框时，键盘可以出现"搜索"俩字，并且可以"回车(Enter)"开始搜索......

为了用户体验更好，在用户输入想要检索的内容后，键盘上需要赫然写着“搜索”两个字，并且因为用键盘的习惯问题，当按下“回车(Enter)”时也必须开始搜索，简便快捷。user用了都说好~~~<form action='' onsubmit="return false;"> <span class="label">关键词：</span> <input type="search" plac

2017-05-10 16:04:11 6837

原创移动端常用框架

1，移动端基础框架zepto.js 语法与jquery几乎一样，会jquery基本会zepto~ iscroll.js 解决页面不支持弹性滚动，不支持fixed引起的问题~ 实现下拉刷新，滑屏，缩放等功能~ underscore.js 该库提供了一整套函数式编程的实用功能，但是没有扩展任何JavaScript内置对象。 fastclick 加快移动端点击响应时间 animate.css

2017-05-05 10:38:47 2343

原创 JS倒计时结束关闭页面：Scripts may close only the windows that were opened by it.

在应用中，经常看见支付成功之后，会有倒计时关闭网页。去年我写过一个关闭网页的小demoHTML<p class='autoClose'>5S后关闭此页面</p>JSfunction task(){ var n=$('.autoClose').html()[0]; if(n>1){//如果n>1 n--;//n-1 $('.autoClose').h

2017-05-05 09:05:50 7873

原创一道前端面试题：用原生JS实现，点击按钮，alert-button的内容

题意：<button>1</button><button>2</button><button>3</button><button>4</button><button>5</button><button>6</button><button>7</button>用原生JS实现：点击按钮，alert 其内容(1,2,3,4,5,6,7,)。当时刚学习前端，打眼儿一看感觉题不难啊，然后以非常迅速

2017-05-03 15:27:59 3577

原创页面加载顺序问题，影响视觉效果，使用loading解决。

静态页面，作为背景的图标先显示，文字后显示。根本原因是：（加载顺序）head标签里（link标签-css文件）-> body里的内容 -> src的script文件 ->页面中写入的js。这里就解释的通了，我的图标都是写在css文件里，所以他要一行行的执行css，将图标都加载出来之后，才开始显示文字信息。我觉着这样的效果不好，用户一定不会等待4s钟的时间看你白白的页面

2017-05-02 17:06:14 1963

原创面试：数组去重方法简单总结~

双重循环<script> var arr = [1,5,3,1,9,8,5,4,2,3]; // 需要去重的数组 var list = []; // 用来存结果数组 for(var i=0;i<arr.length;i++){ var num = arr[i]; if(list.indexOf(num)<0){ list

2017-04-27 14:40:37 875

原创在移动端开发中，容易遇到的问题集合。

1、禁止IOS，Android长按下载图片.css { -webkit-touch-callout : none; }2、禁止IOS，Android用户选中文字 .css { -webkit-user-select : none; }3、① IOS中input [ type =’button’] 显示的不是自己设置的样式，而是IOS默认样式；② 移动端IOS手机下清除输入框内阴影input [

2017-04-26 14:58:03 1901

转载 JAVA面试题（一）

http://www.jianshu.com/p/6e81fdac141f?ref=myread1：EJB:答: Enterprise Java Bean 相当于DCOM，即分布式组件。它是基于Java的远程方法调用（RMI）技术的，所以EJB可以被远程访问（跨进程、跨计算机）。但EJB必须被布署在诸如Webspere、WebLogic这样的容器中，EJB客户从不直接访问真正的EJB组件，而是

2017-04-26 13:18:18 237

原创计算周岁，有了这个就可以知道自己到底多大了，我23，哈哈

计算周岁，有了这个就可以知道自己到底多大了，我23，哈哈最近的业务就是订票，于是乎就有了‘成人’->‘儿童’->‘婴儿’的分类，所以就必须得计算周岁了呀。一开始我想的超级复杂，要计算（出生日期->现在）所差的年月日，还要考虑到闰年平年！！！想想都抓狂。。。还好百度够强大，在csdn遇到了大神这里的一段代码，果然厉害。然后我加了一些注释，进行了测试，简单粗暴，其实很简单的道理，可是我却想不到，

2017-04-26 11:24:35 553

原创 Modal模态框的防穿透问题，模态框弹出后，禁止body滑动事件

我封装的模态框生成是这种结构的代码插入：温馨提示网络不给力哦，请重新进入~ 知道了 $('.pop-content')的max-height是200px，当内容超过200px时，会有滚动条。需要判断①手指touch的点是否为.pop-content或者.pop-content的内容，若不是则阻止滚动②判断滚动条是否在.pop-content 的最上方或者最下方，若是则

2017-04-26 08:41:26 9416

转载 jQuery Ajax同步参数导致浏览器假死怎么办?

俗话说不作死就不会死，今天作死了一回，写了一个比较二逼的函数，遇到了同步Ajax引起的UI线程阻塞问题，在此记录一下。事情起因是这样的，因为页面上有多个相似的异步请求动作，本着提高代码可重用性的原则，我封装了一个名为getData的函数，它接收不同参数，只负责获取数据，然后把数据return。基本的逻辑剥离出来是这样的：function getData1(){ va

2017-04-25 17:17:10 1983

原创描述cookies、sessionStorage和localStorage的区别。

cookie①是网站为了表示用户身份而储存在用户本地终端（client side）上的数据（通常要经过加密）。②cookie数据始终在同源的http请求中携带，会在浏览器和服务器之间来回传递。③cookie 设置的cookie过期时间之前一直有效，即使窗口或浏览器关闭④cookie有大小限制，当超过规定的cookie数时，浏览器会根据自己的机制进行删除老cookie（4KB）

2017-04-25 16:44:19 500

原创移动端开发，IOS、iPhone，表单input元素获取焦点时页面被放大的解决办法。

真心觉得移动端开发坑好多，不过解决问题也有不少乐趣，也能总结很多经验方法，都是之前遇到的，想记录下来方便翻阅。在IOS测试的时候，每次input获取焦点都会使页面放大，真是要多丑有多丑，经多方求助终于得到这个美丽的方法解决一下，之前总是在head中写超多的meta标签，但有一些都没去追寻他们是啥意思。这个问题就是吃了这个亏。 content="width=device-wi

2017-04-25 16:21:36 8469 2

原创移动端开发时，让字体小于12px的方法

之前写过一篇博客，介绍如何让chrome的字体小于12px，戳这里查看今天我们来说下在移动端开发时如何让字体小于12px。在改变chrome字体的时候，在各路大神那里看到过这个方法：当样式表里font-size可是无论我怎么尝试都没效果。还望大神们指教，但重点是！！这句话在移动端相当有用呀。而且我用的时候直接把这句话写在了你想改变字体的元素样式里，例如这样

2017-04-25 16:01:31 11538

原创为什么在元素设置float之后就可以改变宽和高了呢？

今天一个朋友说遇到一个面试题，无论是何种元素（inline，inline-block，block）在设置float之后，都可以改变他的宽度和高度了。做前端这么久我竟然都没思考过这个问题，罪过罪过啊。下面一个小小例子，测试一下。效果图：现在这种情况下，如果想让他们看起来好看点只能设置padding来扩充，因为span是行内元素，无法设置宽度和高度，全靠里面的内容撑起来。

2017-04-25 15:28:42 4837 1

原创解决chrome字体不能小于12px （一道简单的面试题）

当 font-size这时用 tranform:scale(0.8); 进行缩放详细列举transform的用法：1.旋转-webkit-transform: rotate(45deg); /* for Chrome || Safari */-moz-transform: rotate(45deg); /* for Firefox */

2017-04-05 17:06:03 4734

原创 iPhone，winphone,点击元素产生背景或边框怎么去掉

到公司就开始做公众号开发，之前从未接触过，边学习边工作，遇到一些iOS或者是安卓的样式显示不同的问题。逐一列举，做个记录，以后便于查看。在ios系统，当对标签进行点击时，会出现一个灰色的背景，影响美观，后来偶然看到，当元素被点击时，会有highlight背景出现，从而解决了问题： * { -webkit-tap-highlight-color:transparent;

2017-04-05 16:47:29 547