Welcome

首页 / 脚本样式 / JavaScript

最常见的左侧分类菜单栏jQuery实现代码

2017-02-06 18
打开京东、淘宝等各大类网站，最常见的就是左侧分类菜单栏了，既然这么常见的功能，那么应该怎么去实现它呢，接下来，我会在js中介绍两种实现方式，一种是引入jQuery的实现方式，一种是不引入jQuery的原生js的实现方式~~先看效果：一、先准备资料1）如果你们是用jQuery来开发网站的，肯定先要准备jQuery.js呀，这个百度一搜就有。不用jQuery开发的，可以忽略此步骤2）准备一些图片，鼠标右键 > 图片另存为就可以保存icon_nav.jpg...

JavaScript实现图片懒加载（Lazyload）

2017-02-06 18
懒加载的意义（为什么要使用懒加载）对页面加载速度影响最大的就是图片，一张普通的图片可以达到几M的大小，而代码也许就只有几十KB。当页面图片很多时，页面的加载速度缓慢，几S钟内页面没有加载完成，也许会失去很多的用户。所以，对于图片过多的页面，为了加速页面加载速度，所以很多时候我们需要将页面内未出现在可视区域内的图片先不做加载， 等到滚动到可视区域后再去加载。这样子对于页面加载性能上会有很大的提升，也提高了用户体验。原理将页面中的img标签src指向一张小图片...

基于JavaScript实现右键菜单和拖拽功能

2017-02-06 24
下面先给大家介绍下js实现的右键菜单功能，具体详情如下所示：这一章解决的问题 1、实现右键菜单功能代码。 2、阻止默认事件的实际应用。<！DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>右键菜单</title><style type="text/css">#menu {position: fix...

浅析使用BootStrap TreeView插件实现灵活配置快递模板

2017-02-06 19
bootstrap-treeview是一款效果非常酷的基于bootstrap的jQuery多级列表树插件。该jQuery插件基于Twitter Bootstrap，以简单和优雅的方式来显示一些继承树结构，如视图树、列表树等等。开发条件：安装bootstrap-treeview插件，具体操作见：bootstrap-treeview实现功能：1.一个模板可指定子模板（包含多个地区、价格等）2.编辑子模板地区时，动态改变tree的地区（其他子模板选中的地区dis...

js中string和number类型互转换技巧（分享）

2017-02-06 17
1、string-->numberstring类型 *1 即可变成 number类型2、number-->stringnumber类型 +"‘ 即可变成 string 类型<script type="text/javascript">function screenInfo（） {var str = "012.8372";var s = 0;str = str * 1;alert（typeof （str））;//numbers += ...

JS获取年月日时分秒的方法分析

2017-02-06 16
本文实例分析了JS获取年月日时分秒的方法。分享给大家供大家参考，具体如下：var d = new Date（）;var time = d.getFullYear（） + "-" +（d.getMonth（）+1） + "-" + d.getDate（） + " " + d.getHours（） + ":" + d.getMinutes（） + ":" + d.getSeconds（）;必须这么繁杂，没有办法。我以为jQuery会能够精简功能的，发现并没有。...

js窗口震动小程序分享

2017-02-06 18
前言：窗口震动的应用是很常见的，比如最常用的聊天软件qq，就有一个窗口抖动，还有在填表单时的出错提醒，所以自己也写了个很简单的示例，以下是具体的代码<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>窗口震动</title></head><body>&...

ReactJs快速入门教程（精华版）

2017-02-06 22
现在最热门的前端框架有AngularJS、React、Bootstrap等。自从接触了ReactJS，ReactJs的虚拟DOM（Virtual DOM）和组件化的开发深深的吸引了我，下面来跟我一起领略ReactJs的风采吧~~ 文章有点长，耐心读完，你会有很大收获哦~一、ReactJS简介 React 起源于 Facebook 的内部项目，因为该公司对市场上所有 JavaScript MVC 框架，都不满意，就决定自己写一套，用来架设 Instagra...

Bootstrap框架实现广告轮播效果

2017-02-06 19
之前写过一个原生纯js版本的广告轮播，相比之前那个，这个由于用了Bootstrap框架，实现起来代码相对简单一点，而且也比较美观，效果如图：其中某一张图片这是其中的两张图片，可以看到上面有小圆点，就和平时看到的一些网站的一样，点击圆点可以切换图片，按照指定的顺序，还有上面的箭头，点击左右箭头，就可以左右移动，这就是大体的功能。接下来上代码： HTML代码：<！-- 广告轮播 --><div id="ad-carousel" class="...

jQuery扩展实现text提示还能输入多少字节的方法

2017-02-06 16
本文实例讲述了jQuery扩展实现text提示还能输入多少字节的方法。分享给大家供大家参考，具体如下：1.添加jQuery自定义扩展$（function（$）{// tipWrap:提示消息的容器// maxNumber:最大输入字符$.fn.artTxtCount = function（tipWrap, maxNumber）{var countClass = "js_txtCount",// 定义内部容器的CSS类名fullClass = "js_txt...

Bootstrap实现导航栏的2种方式

2017-02-06 17
前言：导航是一个网站重要的元素组件之一，可以便于用户查找网站所提供的各项功能服务。导航的制作方法也是千奇百怪，五花八门。在下面的内容中，介绍两种制作导航栏的方式。一、用按钮组实现，代码如下：<div style="width:100%; background:#ff0"> <div class="btn-group"> <button class="btn btn-default" type="button">首页<...

js简单正则验证汉字英文及下划线的方法

2017-02-06 17
本文实例讲述了js简单正则验证汉字英文及下划线的方法。分享给大家供大家参考，具体如下：<！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>...

Bootstrap选项卡动态切换效果

2017-02-06 15
最近在写一个系统的首页，就是平常的一个顶部导航栏，上面有登录和注册两个按钮，点击按钮弹出相应的登录或注册框，为了方便交互，把登录和注册在一个选项卡里放着，每次用户不用回到顶部去点击，只需要在当前框点击就可切换，先看一下样子吧，如图所示： 用Bootstrap平时在写静态页面时，只需要把.active类给自己想要第一个展现的框就可以，而动态的时候并不能简单的在js代码中给自己想要第一个展现的框直接设置.active，这样当切换时第一个设置为active的一直...

EasyUI Combobox设置默认值 获取text的方法

2017-02-06 18
$（"#xxx"）.combobox（"setValue",11）;$（"#epsId_combo"）.combobox（"selectedIndex",0）;<pre class="html" name="code"><select id="xxx" class="easyui-combobox" style="width: 180px;"> <option value="1">第一个</option> &...

完全深入学习Bootstrap表单

2017-02-06 16
前言：由于表单的元素比较多，因此将Bootstrap的表单单独做个总结，表单作为Bootstrap的核心内容，主要功能是用来与用户做交流的一个网页控件，良好的表单设计能够让网页与用户更好的沟通。表单中常见的元素主要包括：文本输入框、下拉选择框、单选按钮、复选按钮、文本域和按钮等。一、基础表单<form role="form"> <div class="form-group"><label for="exampleInputEm...

JS调用打印机功能简单示例

2017-02-06 18
本文实例讲述了JS调用打印机功能的方法。分享给大家供大家参考，具体如下：<！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><met...

jQGrid动态填充select下拉框的选项值（动态填充）

2017-02-06 17
本文给大家分享一段代码关于技巧jqgrid动态填充select 下拉框的选项值，非常不多说了，直接给大家贴代码了，具体代码如下所示：function gettypes（）{ //动态生成select内容 var str=""; $.ajax（{ type:"post", async:false, url:"checkpersontype", success:function（data）{ if （data ！= null） { var jsonobj=ev...

简单实现JavaScript图片切换效果

2017-02-06 17
JavaScript实现图片切换，主要用到setInterval（）函数和clearInterval（）函数，前者功能是开启动画，后者功能则为清除动画（可理解为使动画停止），为了使动画停止，则需要定义全局变量作为标志，标志返回setInterval（）函数的id，id作为clearInterval（）函数的引用，目的是为了告诉clearInterval（）函数动画暂停的位置。下面是实现的代码：部分HTML代码：第一个为左按钮，是一张带箭头的透明图片，点击实...

JS两种类型的表单提交方法实例分析

2017-02-06 16
本文实例分析了JS两种类型的表单提交方法。分享给大家供大家参考，具体如下：1.原始的<form method="post" action="/student/stureg/add" id="form1" onsubmit="return subForm（）;"><button type="submit" class="button red" style="font-size:18px; font-family:"微软雅黑";">提交...

jQuery select自动选中功能实现方法分析

2017-02-06 16
本文实例分析了jQuery select自动选中功能实现方法。分享给大家供大家参考，具体如下：//筛选var typeid = "<！--{$typeid}-->";var bigclassid = "<！--{$bigclassid}-->";var smallclassid = "<！--{$smallclassid}-->";$（"#typeid option[value="+typeid+"]"）.attr（"s...
<< 61 62 63 64 65 66 67 68 69 70 >>
版权所有©石家庄振强科技有限公司2024 冀ICP备08103738号-5 网站地图