VUEJS实战之利用laypage插件实现分页（3）

2017年02月06日 9 阅读

前言在上两章的工作中,我们顺利的实现了首页的渲染,但是,只是渲染了一页数据而已.我们可能需要渲染更多的数据,这时候,我们就有必要考虑分页了.分页有很多种方式,比如异步加载的分页方式.然而对于没有太多使用前端模版框架的朋友来说,一上来就使用这种方式,可能稍微有点难度.因此,我们这章的分页实现,是基于普通的链接分页的方式完成的.在我们有了更多的前端框架的使用经验之后,我们可以使用更加丰富的分页方法.事实上,我们自己构建一个分页组件也不是不可以,在移动端我都是自...

jquery制做精致的倒计时特效

2017年02月06日 9 阅读

本文实例为大家分享了jquery做一个小的倒计时效果的代码，供大家参考，具体内容如下html：<div id="shop_rec"> <ul class="cf"><li> <img src="image/goods.jpg" alt="小米 Note 顶配版" /> <div><h5>小米 Note 顶配版</h5><p>全网通 香槟金 移动联通<br ...

Bootstrap页面布局基础知识全面解析

2017年02月06日 10 阅读

Bootstrap作为支持响应式布局的一个前端插件，确实发挥着重要的作用，无论你是在手机，平板还是ＰＣ上浏览网页，都能达到不错的效果，这一切一切，都是bootstrap带给我们的！今天主要说下页面的布局，这是最基础的东西了，当我们设计一个站点时，应该为它设计一个全局性的统一的规范页面，这种页面我们叫它布局页，而在页面上体现出来的东西，就是布局的元素，在bootstrap里当然也是不可缺少的东西。Bootstrap的布局是一种栅格系统，即它由行和列组成，在使...

Bootstrap布局之栅格系统详解

2017年02月06日 9 阅读

前些天学习了bootstrap,把其中的栅格系统整理出来，如有错误，欢迎指正。概要，栅格系统针对pc,pad,移动端开发出响应式web页面，根据不同屏幕分辨率有针对不同的解决方法。（0.1, 屏幕设备尺寸大于1200px 选择col-lg（0.2. 屏幕设备尺寸在970px到1200px 选择col-md（0.3. 屏幕设备尺寸在768px到970px 选择col-sm（0.4. 屏幕设备尺寸小于768px 选择col-xs1.栅格系统把页面分为12栏（最...

BootStrap智能表单demo示例详解

2017年02月06日 9 阅读

1.基本配置，支持的元素类型2.自动布局3.自定义布局4.自定义表单5.数据绑定6.带验证的表单7、智能搜索8、级联下拉9、图片上传图片有点大了，屏幕不够大的话可能看的不习惯，没事 后面我截图的实际尽量弄小点O（∩_∩）O~~接下来进入实战吧：感兴趣的朋友请持续关注下篇。...

BootStrap 智能表单实战系列（二）BootStrap支持的类型简介

2017年02月06日 9 阅读

什么是 Bootstrap？Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的。历史Bootstrap 是由 Twitter 的 Mark Otto 和 Jacob Thornton 开发的。Bootstrap 是 2011 年八月在 GitHub 上发布的开源产品。Bootstrap 包的内容基本结构：Bootstrap 提供了一个带有网格系统、链接样式、背景的...

BootStrap智能表单实战系列（三）分块表单配置详解

2017年02月06日 9 阅读

什么是 Bootstrap？Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的。历史Bootstrap 是由 Twitter 的 Mark Otto 和 Jacob Thornton 开发的。Bootstrap 是 2011 年八月在 GitHub 上发布的开源产品。Bootstrap 包的内容基本结构：Bootstrap 提供了一个带有网格系统、链接样式、背景的...

JS/jQ实现免费获取手机验证码倒计时效果

2017年02月06日 10 阅读

最近做了一个项目，其中有项目需求涉及到手机号验证码，就是当用户点击获取验证码之后我们会发送一条信息到用户手机，然后就会出现一个倒计时按钮，很像支付宝手机付款效果了，下面我给大家分享两个实现代码。如何获取手机验证码？小月不知道大家是利用什么平台去获取验证码的，但是告诉大家我是在哪个平台获取的。LeanCloud ：https://leancloud.cn/文档：https://leancloud.cn/docs/sms_guide-js.html在这个平台首...

BootStrap智能表单实战系列（四）表单布局介绍

2017年02月06日 9 阅读

什么是 Bootstrap？Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的。表单的布局分为自动布局和自定义布局两种：自动布局就是根据配置项中第二级配置项中数组的长度来自动使用不同的bootstrap栅格，通过设置autoLayout为true可以实现自动布局自动以布局就是根据autoLayout来决定使用的栅格，通过设置autoLayout:"1,2,1,2,...

BootStrap 智能表单实战系列（五） 表单依赖插件处理

2017年02月06日 9 阅读

什么是 Bootstrap？Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的。历史Bootstrap 是由 Twitter 的 Mark Otto 和 Jacob Thornton 开发的。Bootstrap 是 2011 年八月在 GitHub 上发布的开源产品。Bootstrap 包的内容基本结构：Bootstrap 提供了一个带有网格系统、链接样式、背景的...

js 截取或者替换字符串中的数字实现方法

2017年02月06日 9 阅读

在js操作表格时，我们经常会需要得到或者修改name中的下标，如：name="cust[1]/custName";替换：name.replace（/[d]+/,num）; //num为你需要替换成的数字变量获取：name.match（/[d]+/）。获取多个：name.match（/[d]+/g）。以上这篇js 截取或者替换字符串中的数字实现方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。...

BootStrap智能表单实战系列（六）表单编辑页面的数据绑定

2017年02月06日 10 阅读

什么是 Bootstrap？Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的。历史Bootstrap 是由 Twitter 的 Mark Otto 和 Jacob Thornton 开发的。Bootstrap 是 2011 年八月在 GitHub 上发布的开源产品。Bootstrap 包的内容基本结构：Bootstrap 提供了一个带有网格系统、链接样式、背景的...

BootStrap智能表单实战系列（七）验证的支持

2017年02月06日 9 阅读

但凡是涉及到用户编辑信息然后保存的页面，都涉及到一个数据是否符合要求的检查，需要客服端和服务器端的校验的问题；客服端的校验主要是为了提高用户体验，而服务器端的校验为了数据的合格性该插件也为您支持到了表单验证，在需要验证的列的配置中加一项required:true 再生成表单元素前面的label的时候会自动在label前面生成一个*，用于提示 改列数据会进行校验验证是使用了jquery validation，具体使用方式请参照jquery validatio...

BootStrap智能表单实战系列（八）表单配置json详解

2017年02月06日 9 阅读

本章属于该系列的高级部分，将介绍表单中一些列的配置1、config列的配置：主要用于控制布局 ：config:{autoLayout:true|"1,2,2,4"}true:根据配置项最里层的数量来自动使用不同的栅格，"1,2,2,4":使用指定的栅格来布局，如果配置的列数不足的情况将使用第一项（n,n 为一项）2、hides的配置项hides:[{id:"xxx",value:""}]此项是可选的，主要用于编辑时存放一些不可见的列（如主键ID的值）3、e...

浅谈JavaScript对象的创建方式

2017年02月06日 10 阅读

通过Object构造函数或对象字面量创建对象时，使用同一个接口创建很多对象时，会产生大量的重复代码。为了简化，引入了工厂模式。工厂模式function createPerson（name, age, job） {var obj = new Object（）;obj.name = name;obj.age = age;obj.job = job;obj.sayHello（）{alert（this.name）;};return obj;}var p1 = cr...

BootStrap智能表单实战系列（九）表单图片上传的支持

2017年02月06日 9 阅读

什么是 Bootstrap？Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的。历史Bootstrap 是由 Twitter 的 Mark Otto 和 Jacob Thornton 开发的。Bootstrap 是 2011 年八月在 GitHub 上发布的开源产品。Bootstrap 包的内容基本结构：Bootstrap 提供了一个带有网格系统、链接样式、背景的...

BootStrap 智能表单实战系列（十）自动完成组件的支持

2017年02月06日 9 阅读

web开发中，肯定遇到像百度、google这种搜索的功能吧，那智能表单中的自动完成可以做什么呢，下面来揭晓：1、包含像google、百度等类似的简单搜索2、复杂结构的支持，比如说 输入产品编号，需要将产品的编号、产品的名称、产品的单价、产品的备注信息等填写会表单中的某个位置代码如下（页面地址：https://github.com/xiexingen/Bootstrap-SmartForm/blob/master/demo/form3-ele-autocom...

BootStrap智能表单实战系列（十一）级联下拉的支持

2017年02月06日 9 阅读

什么是 Bootstrap？Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的。历史Bootstrap 是由 Twitter 的 Mark Otto 和 Jacob Thornton 开发的。Bootstrap 是 2011 年八月在 GitHub 上发布的开源产品。Bootstrap 包的内容基本结构：Bootstrap 提供了一个带有网格系统、链接样式、背景的...

实例讲解JavaScript中的this指向错误解决方法

2017年02月06日 9 阅读

看如下对象定义："use strict"var jane = {name ： ‘Jane",display : function（）{retrun "Person named " + this.name;}};这样能正常调用jane.display（）;下面的调用会出错：var func = jane.display;func（）TypeError: Cannot read property "name" of undefined因为，this指向已经改变...

jQuery实现手机自定义弹出输入框

2017年02月06日 9 阅读

手机涉及到填写表单时，需要手机弹出自定义的输入框，而非手机自带的输入键盘，如大写数字等。实现思路（考虑多种文本输入形式）：首先，文本框获取焦点时禁止手机弹出自带的输入键盘。// 禁用手机自带的键盘输入框function forbidFocus（i）{$（"#txt"+i）.focus（function（）{document.activeElement.blur（）;}）;} 其次，显示与关闭自定义的输入键盘。// 打开自定义输入键盘function sho...