在某项目中遇到excel导入时客户要求显示滚动条效果，在此基础上使用js为其封装了个进度条类，只需要简单为其创建个div容器就可轻松实现效果，类具体如下：<!DOCTYPE html> <html lang="zh-CN"><head><meta charset="utf-8" /><meta http-equiv="X-UA-Compatible" content="IE=edge" /><meta name="viewport" content="width=device-width,initial-scale=1" /><title>Bootstrap 101 Template</title><!-- 最新版本的 Bootstrap 核心...
1.安装插件 npm install jquery --save //jquery插件 npm install bootstrap --save //bootstrap npm install --save popper.js //popper.js2.修改build目录下的webpack.base.conf.js配置文件： 1）加入webpack对象：var webpack=require(webpack); 2）在module.exports里面加入以下配置： plugins: [new webpack.optimize.CommonsChunkPlugin(common),new webpack.ProvidePlugin({$: jquery,jQuery: jquery,Popper: [p...
说明，项目本身使用jquery和bootstrap做的管理后台，部分登录接口跑在node服务端，大部分接口使用springmvc实现。现在，使用vue开发，集成vue到原先的项目中。不影响原先的框架。原来的打包方式是使用fis打包，集成vue之后，先用webpack打包，再用fis打包。互不影响。 1、由于原先使用jquery和bootstrap，所以package.json文件夹下面没有数据。使用vue的时候，需要的依赖全部放到package.json下，添加如下依赖： {"name": "node","...
做一个项目的时候 ，控制台总是会出现各种bug,其实不用慌张，终结起来也就几种类型的错误，在开发中每次遇到错误都善于总结，下次在看到就会胸有成竹知道是什么情况了，以下是在开发过程中总结的一些错误以及错误的解决方法。 报错一：Uncaught ReferenceError: $ is not defined Uncaught ReferenceError: $ is not defined Uncaught ReferenceError: jQuery is not defined 错误原因：文件加载的顺序不对，jQuery文件的顺序要在...
写在前面： 本文是vue-手摸手教你使用vue-cli脚手架-详细步骤图文解析之后，又一篇关于vue-cli脚手架配置相关的文章，因为有些文章步骤不够清晰，当时我引入JQuery、bootstrap的时候颇费了一番功夫，所以本文的步骤会尽量详细一点。引入bootstrap1. 下载所需要的bootstrap文件。将要使用的bootstrap文件放入src目录下的assets文件夹中。2. 在入口文件src/main.js中引入bootstrapimport ./assets/bootstrap-3.3.7-dist/css/bootstra...
下载链接地址：链接: https://pan.baidu.com/s/1pLl0uCj 密码: cd59 然后直接请看代码： 引用： <script type="text/javascript" src="${ contextPath }/res/sys/scripts/jquery.editable-select.min.js"></script> <link href="${ contextPath }/res/sys/scripts/css/jquery.editable-select.min.css" rel="external nofollow" rel="stylesheet">HTML部分： </tr> <tr> <th valign="middle" > <h4>用量</h4> </th> <td valign="mi...
Bootstrap是网上最流行的前端开发框架. 除了用它，我不知道还有其他更快的方法去构建一个响应式的网站。 但是自从我向网页添加动态功能的工具变成vue.js后。适应bootstrap变得困难起来。因为这带来了一些技术包袱。没错。我说的就是jquery。 这并不是在抨击jquery，我只是意识到，当你已经在项目里使用一些像Vue的框架后，再引入jQuery就会出现一些显著的缺点： 增加开销。jQuery将会使你的网页增加30KB。 在使用诸如webpack一类的...
本文实例为大家分享了BootstrapValidator使用方法，供大家参考，具体内容如下 github：https://github.com/nghuuphuoc/bootstrapvalidator 参考博客：JS组件系列——Form表单验证神器： BootstrapValidator 参考博客：bootstrapvalidator之API学习 表单HTML，如下： <form role="form" id="roleForm"><div class="box-body"><div class="form-group"><input type="text" class="form-control" id="inputRoleName"name="roleName" p...
前言 最近几天在公司做了个后台管理系统的小模块，其中有个功能是实现复选框的全选和全不选，用bootstrap和jQuery来实现。效果是这样：因为是内部用，样式也不要求太好看，直接上代码。 示例代码： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"><head><META content="IE=11.0000" http-equiv="X-UA-C...
之前的文章中我们已经搭建好框架，并且设计好了，数据库。 现在我们开始实现登录功能，这个可以说是Web应用最最最普遍的功能了。 先来说说我们登录的逻辑： 输入用户名、密码(validate进行前端验证)——ajax调用后台action方法——根据用户名调用业务层到数据层查询数据库信息——查询的密码跟用户输入的密码比对——shiro登录身份验证——将用户信息存入session——响应前端——前端跳转 这个是我要告诉大家的姿势，还有很多很多的...
本文实例讲述了bootstrap+jQuery实现的动态进度条功能。分享给大家供大家参考，具体如下： 此款进度条实现的功能： 1.利用了bootstrap的进度条组件。 a.在最外层的<div>中加入class .progress，在里层<div>加入class .progress-bar从而实现基本的进度条。 b.在外层<div>中加入class .progress－striped实现条纹进度条。 c.在内层<div>加入class .progress－bar－danger/warning/info/success 从而实现红色、黄色、蓝色、绿色 d.在外...
这两天学习了Vue.js ，所以，今天添加一点小笔记。 一、引入jQuery 在当前项目的目录下（就是package.json），运行命令 cnpm install jquery --save-dev 这样就将jquery安装到了这个项目中。 然后修改webpack.base.conf.js(在build文件下)两个地方： 1：加入 var webpack=require(webpack);2 在module.exports的里面加入 plugins: [new webpack.optimize.CommonsChunkPlugin(common.js),new webpack.ProvidePlugin({jQuery: "jque...
轮播广告在网站中的应用实在是太常见了，下面说一说怎样使用bootstrap中的Carousel插件来实现轮播广告效果，下图为最终效果：具体实现方法请看下面的代码： <div class="carousel slide" data-ride="carousel" id="carousel" data-interval="3000"> //data-interval设置轮播间隔为3秒钟<!-- 广告序号指示器(表示当前第几张的下方的几个小圆圈)，可加可不加 --><ol class="carousel-indicators"><li data-target="#carousel" data-s...
Bootstrap风格的分页控件自适应的： 参考网址：分页参考文档 1.风格样式：2.首先引入js文件jQuery.twbsPagination.js <span style="font-size:14px;"><script type="text/javascript" src="plugins/page/jquery.twbsPagination.js"></script></span> 3.html页面 <span style="font-size:14px;"><div class="text-center"> <ul id="pagination-log" class="pagination-sm"></ul> </div></span> 4.初始化 <span style="font-size:14...
昨天小编在研究regexp，今天小编抽空给大家分享表单验证。 主要功能： 用户名必须在5-25个字符之内，而且只能使用字母、数字或下划线，否则不让通过。密码必须在5-25个字符之内，而且只能使用字母或数字（大小写敏感），否则不让通过。根据不同密码程度，下面的low、medium和high会改变背景颜色。确认密码就不说啦。验证码只是做了个样子，反正就是设成必须是5个数字。checkbox必须打勾啦，不然不让通过。点击注册按钮，会有相应的...