Welcome 微信登录

首页 / 脚本样式 / JavaScript

JS获取中文拼音首字母并通过拼音首字母快速查找页面内对应中文内容的方法【附demo源码】

JS获取中文拼音首字母并通过拼音首字母快速查找页面内对应中文内容的方法【附demo源码】

2016年08月24日 16 阅读
本文实例讲述了JS获取中文拼音首字母并通过拼音首字母快速查找页面内对应中文内容的方法。分享给大家供大家参考，具体如下：实现效果：图一：图二：此例中输入的中文字符串“万万保重”，有三个字是多音字，所以alert对话框中显示的是多种读音的组合；如何实现？如何实现通过拼音首字母快速查找页面内的中文内容呢？过程原理是这样的：例如要对一些人名进行快速查找，当页面加载完成后，对所有人名建立一个索引，生成拼音首字母与姓名的对应关系；然后监听键盘事件，当用户按下键盘时，根...
巧用jQuery选择器提高写表单效率的方法

巧用jQuery选择器提高写表单效率的方法

2016年08月24日 19 阅读
相信很多小伙伴都会遇到需要做表单的需求，就像我现在做的医院项目，茫茫多的表单无穷无尽。一开始做表单使用最笨的方法：一个个span去定义ID，每个数据都用ajax获取后赋值显示，然后在表单提交前一个个用jQuery根据ID获取元素的value，组成一个model来提交给服务器。 后来发现使用jQuery可以大大简化这个过程。于是我修改了工作方法，总结了我的一些提高写表单效率的方法。需求表单中存在最多的无非就是文本、文本框、单选框、多选框。而一些表单中会有几十...
javascript简单实现跟随滚动条漂浮的返回顶部按钮效果

javascript简单实现跟随滚动条漂浮的返回顶部按钮效果

2016年08月24日 19 阅读
本文实例讲述了javascript简单实现跟随滚动条漂浮的返回顶部按钮效果。分享给大家供大家参考，具体如下：比较优秀的一款超过一屏高度才显示的，跟随滚动条漂浮的返回顶部按钮特效代码。运行效果如下图所示：完整实例代码如下：<！DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dt...
JS实现六位字符密码输入器功能

JS实现六位字符密码输入器功能

2016年08月24日 13 阅读
老规矩~ 上DEMO，过过瘾先：六位字符密码输入器再上源码：六位字符密码输入器从DEMO中我看可以看出，首先只能输入六个字符，并且仅允许输入数字，在输入六位数字完成之后会自动执行一个回调（DEMO中是将输入结果显示出来了）一. 先说原理首先呢，我们需要两个东东：其一是一个真是的输入框，即：真正处于焦点状态并获取用户输入的input；其二是一组伪输入框，即：并没有真正获取焦点，但只是显示了当前输入的值（当然啦，密码嘛，只有一个小黑点而已~）。其次呢，我们需要...
javascript设计模式之module（模块）模式

javascript设计模式之module（模块）模式

2016年08月24日 17 阅读
模块是任何强大应用程序中不可或缺的一部分，它通常能帮助我们清晰地分离和组织项目中的代码单元。js中实现模块的方法：1.对象字面量表示法2.Module模式3.AMD模块4.CommonJS模块5.ECMAScript Harmony 模块对象字面量对象字面量不需要使用new运算符进行实例化，但不能用在一个语句的开头，因为开始的可能被解读为一个块的开始，在对象的外部，新成员可以使用如下赋值语句添加到对象字面量上，myModule.property = “so...
JavaScript面向对象编写购物车功能

JavaScript面向对象编写购物车功能

2016年08月24日 19 阅读
之前的项目中需要一个购买数据商品并付款的功能，刚开始一直不敢使用面向对象的写法，主要是没有理清思路，而且那时的数据商品比较的复杂，就一直没敢动，在网上也找些面向对象的写法，把思路理清一遍，就想自己试着写写。接下来我会一步一步分析，面向对象的写法过程。整个流程大致分为：1、先定义好一个商品列表的数据形式和商品总数集，类似：var data = [{name: "name", unitPrice: 10, num: 2}];var total = {type:...
js实现select选择框效果及美化

js实现select选择框效果及美化

2016年08月24日 21 阅读
网上有各种各样的关于 select 选择框的美化，找了很多，并没有好的样式效果。所以就找了一个利用 ul li 做的类似 select 选择框的效果，不废话了，先上图，效果如下：点击一个 test ，就会把列表显示出来，再次点击，列表隐藏，选择一个 li ，就会把 span 里的内容替换成 li 的内容，然后可以用 js 监控 span 的变化，然后执行你的代码。效果如下：html 代码如下：<div id="type" class="test"&g...
浅谈Javascript中的12种DOM节点类型

浅谈Javascript中的12种DOM节点类型

2016年08月24日 20 阅读
前言DOM的作用是将网页转为一个javascript对象，从而可以使用javascript对网页进行各种操作（比如增删内容）。浏览器会根据DOM模型，将HTML文档解析成一系列的节点，再由这些节点组成一个树状结构。DOM的最小组成单位叫做节点（node），文档的树形结构（DOM树）由12种类型的节点组成。属性一般地，节点至少拥有nodeType、nodeName和nodeValue这三个基本属性。节点类型不同，这三个属性的值也不相同nodeTypenode...
手机Web APP如何实现分享多平台功能

手机Web APP如何实现分享多平台功能

2016年08月24日 20 阅读
话说App一般都带有分享到社交平台的入口，web网页的分享也有很不错的框架，但是随着HTML5的不断发展，手机web页面越来越多的进入到我们的生活中，那如何在我们的手机上完成分享呢？话说各大分享平台都有针对Android、Ios的SDK，作为开发者，我们只需要将SDK集成的我们的项目中即可，通过提供的外部接口，我们可以很容易的完成分享的功能；web网页呢，网上也存在很多优秀的分享框架，例如：bShare分享 、JiaThis分享；我们可以很方便的集成到我们...
用原生js统计文本行数的简单示例

用原生js统计文本行数的简单示例

2016年08月24日 15 阅读
前言在开发的时候会遇到这种情况，只显示两行，如果超过两行，则显示一个“显示更多”的按钮，点击按钮来显示剩余行的内容。有个 jQuery 的插件 loadingDots 专门实现了这个功能。不过今天这里我们要用原生的Javascript来实现，要实现这个需求，最关键的是要确定这个容器内文本的行数，得到行数后，修改元素高度，并确定是否显示加载按钮。window.getComputedStyle（）要使用原生 JavaScript 代码获取一个元素的各个 sty...
再谈Javascript中的异步以及如何异步

再谈Javascript中的异步以及如何异步

2016年08月24日 13 阅读
为什么需要异步？why？来看一段代码。问题1：for（var i=0;i<100000;i++）{}alert（"hello world！！！"）; 这段代码的意思是执行100...次后再执行alert，这样带来的问题是，严重堵塞了后面代码的执行，至于为什么，主要是因为JS是单线程的。问题2： 我们通常要解决这样一个问题，如果我们需要在head里面加入script代码的话，一般会将代码写在window.onload里面（如果操作了dom的话），你...
js 基础篇必看（点击事件轮播图的简单实现）

js 基础篇必看（点击事件轮播图的简单实现）

2016年08月24日 13 阅读
轮播图在以后的应用中还是比较常见的，不需要多少行代码就能实现。但是在只掌握了js基础知识的情况下，怎么来用较少的而且逻辑又简单的方法来实现呢？下面来分析下几种不同的做法：1、利用位移的方法来实现首先，我们可以在body中添加一个div并且将宽度设置成百分比（自适应页面），比例具体是相对谁的百分比的话按需求来做，在这里不多说。将图片放入到div 中。其次，样式部分将img标签全部设置成absolute；以方便定位最后，js部分说说逻辑，定义两个空数组，第一个...
浅谈时钟的生成（js手写简洁代码）

浅谈时钟的生成（js手写简洁代码）

2016年08月24日 14 阅读
在生成时钟的过程中自己想到布置表盘的写法由这么几种：当然利用那种模式都可以实现，所以我们要用一个最好理解，代码有相对简便的方法实现1、利用三角函数用js在三角函数布置表盘的过程中有遇见到这种情况：是在表盘的刻度处，利用三角函数计算具体的值时不能得到整数，需要向上或者向下取整，这样无形中就会存在些许偏差，而且这样的偏差难利用样式来调整到位，即使最终效果都可以实现，但是细微处的缝隙和角度的偏差都会影响整体的视觉体验，作为一名程序开发人员，这样的视觉体验很难让别...
老生常谈JavaScript 正则表达式语法

老生常谈JavaScript 正则表达式语法

2016年08月24日 16 阅读
JavaScript定义正则表达式有两种方法。1.RegExp构造函数var pattern = new RegExp（"[bc]at","i"）;它接收两个参数：一个是要匹配的字符串模式，另一个是可选的标志字符串。2.字面量var pattern = /[bc]at/i;正则表达式的匹配模式支持三种标志字符串：g:global，全局搜索模式，该模式将被应用于所有字符串，而并非搜索到第一个匹配项就停止搜索；i:ingore case，忽略字母大小写，即在确...
基于JavaScript Array数组方法（新手必看篇）

基于JavaScript Array数组方法（新手必看篇）

2016年08月24日 17 阅读
Array类型是ECMAScript中最常用的引用类型。ECMAScript中的数据与其它大多数语言中的数组有着相当大的区别。虽然ECMAScript中的数据与其它语言中的数组一样都是数据的有序列表，但不同的是，ECMAScript数组中的每一项可以保存任何类型的数据，无论是数值、字符串或者是对象。同时，ECMAScript中的数组大小是可以动态调整的，即可以根据数据的添加自动增长以容纳新增的数据。下面总结一下JavaScript中数组常用的操作函数及用法...
javascript之IE版本检测超简单方法

javascript之IE版本检测超简单方法

2016年08月24日 23 阅读
近年来随着操作系统的升级以及各种新技术的开发普及，抛弃低版本IE已经是大势所趋，这对于前端人员来时是个好消息，可以不用花费太多的时间来做低版本的兼容，很多站点采用给予低版本IE以提示的方式（恩，很友好很人道）给游客，一般是在header上给一个提示，脚本检测如下：function getIEVersion（）{var rv = -1; // Return value assumes failure.if（navigator.appName == "Micr...
javascript数字验证的实例代码（推荐）

javascript数字验证的实例代码（推荐）

2016年08月24日 19 阅读
现在有一个需求如下图：产品经理说Card Number只能让输入数字（中间的空格是格式自加的，也是用js实现的），有时候我脑海中出现了个声音，啥玩意，加个type=number不就行了，事实发现图样图森破了，先不说type=number后面会有个上下标（虽然用css可干掉），但是这个类型是支持科学输入法的，就是小数点和e这样的是可以输入的，于是乎只能用其他的方式了，后来想用检索到输入了非数字就干掉，但是这样还是能输入，想法被打回，于是乎最终采用了键盘输入控...
js显示动态时间的方法详解

js显示动态时间的方法详解

2016年08月24日 19 阅读
本文实例讲述了js显示动态时间的方法。分享给大家供大家参考，具体如下：Date对象的方法Date 对象能够使你获得相对于国际标准时间（格林威治标准时间，现在被称为 UTC-Universal Coordinated Time）或者是 Flash 播放器正运行的操作系统的时间和日期。要使用Date对象的方法，你就必须先创建一个Date对象的实体（Instance）。Date 对象必须使用 Flash 5 或以后版本的播放器。Date 对象的方法并不是静态的，...
<< 1491 1492 1493 1494 1495 1496 1497 1498 1499 1500 >>
版权所有©石家庄振强科技有限公司2024 冀ICP备08103738号-5 网站地图