`
RushProgram
  • 浏览: 5586 次
  • 性别: Icon_minigender_1
  • 来自: 湖北省宜昌市
最近访客 更多访客>>
社区版块
存档分类
最新评论

Javascript模糊查询 | 第三章 最终代码。

阅读更多

 

前几章的位置:

 

Javascript模糊查找 | 第一章 循环不能不重视。


 

 

http://blog.csdn.net/yorhomwang/article/details/7855991

 

 

Javascript做模糊查询 | 第二章 完美的调用筑造最后的成功。


 

http://blog.csdn.net/yorhomwang/article/details/7855997

这一章呢,我没有什么好讲的了,就祝愿大家喜欢我的这篇文章,我会努力,尽我所能地为大家提供更好的代码和讲解。

具体代码如下:

 

<html>  
<head>  
<title>Javascript模糊查找</title>  
</head>  
<body>  
  
  
<li onload="load('Name')" id="name">Name</li>  
<li onload="load('sex')" id="sex">sex</li>  
<li onload="load('age')" id="age">age</li>  
<li onload="load('job')" id="job">job</li>  
<li onload="load('mail')" id="mail">E-mail</li>  
  
  
<input id="input" type="text" value="" />  
<input id="search" type="button" onclick="findEach()" value="Search" />  
  
  
<script>  
var vData= ["name", "sex", "age", "job", "E-mail"];  
  
  
function load(id)  
{  
alert(vData[0]);  
//vData[vData.length] = document.getElementById(id).innerHTML;  
}  
  
  
function find(sFind, sObj)  
{  
var nSize = sFind.length;  
var nLen = sObj.length;  
  
  
var sCompare;  
  
  
if(nSize <= nLen ){  
for(var i = 0; i <= nLen - nSize; i++){  
sCompare = sObj.substring(i, i + nSize);  
if(sCompare == sFind){  
return i;  
}  
}  
}  
  
  
return -1;  
}  
  
  
function findEach()  
{  
var sFind = document.getElementById("input").value;  
if(sFind==""){  
alert("Can not be empty");  
}  
  
  
if(sFind!=""){  
var nPos;  
var vResult = [];  
  
//for(var i = 0; i <= vData.length; i++){  
for(var i in vData){  
//nPos = find(sFind, vData[i]);  
var sTxt=vData[i]||'';  
nPos=sTxt.indexOf(sFind);  
if(nPos>=0){  
vResult[vResult.length] = sTxt;  
}  
}  
  
  
alert(vResult);  
}  
}  
  
  
</script>  
</body>  
</html>  


(这些代码在我的文章"Javascript做模糊查找"有,但我怕大家不懂,因此分章节写出来了,希望我写得大家都懂吧。)

 

那么这些代码运行出来是什么样的呢?

就是这样的,如果你在input里输入a,那结果如下:


 

看看图上的li里的有Name,sex,age,job,E-mail,那输出来的就有Name,age,E-mail说明运行成功!!!!当然你不信的话可以自己去试试。

我一再重复:

 

var vData= ["name", "sex", "age", "job", "E-mail"];  

这行代码是关键,它会影响输出的结果。因此li里的只是个提示有哪些可查到,而并非核心所在,也就是说li里的是个装饰。

 

最后祝个位身体健康,工作顺利!我将以更好的文章来回报大家的支持。

0
8
分享到:
评论

相关推荐

    python入门到高级全栈工程师培训 第3期 附课件代码

    第3章 01 网络基础和dos命令 02 为何学习linux 03 课程内容介绍 04 操作系统内核与系统调用 05 操作系统安装原理 06 linux操作系统安装 07 初识linux命令 08 linux操作系统目录结构 09 目录及文件操作 第4章 01 ...

    JavaScript基础

    #### 三、JavaScript的重要发展阶段 - **早期版本**: - **JavaScript 1.0 (1996)**:NetscapeNavigator2.0发布时随附的第一个版本。 - **JavaScript 1.1 (1997)**:提交给ECMA制定标准的版本。 - **ECMAScript ...

    《you don't know js》高清完整版

    书籍中的第三章专注于“进入YDKJS”,这部分内容显然深入讨论了JavaScript这一编程语言,包括其复杂的概念如闭包、对象和方法。通过深入学习这些概念,读者可以更加清晰地掌握JavaScript的高级特性,从而编写出更加...

    Javascript实现图片加载从模糊到清晰显示的方法

    在进行网络相册图片加载功能的设计时,...同时,为了进一步深入学习JavaScript和相关的开发技术,可以查阅《JavaScript参考教程》和《JavaScript代码风格指南》等权威教材,以便更加全面地掌握前端开发的技巧和方法。

    极力推荐10个短小实用的JavaScript代码段

    JavaScript是一种广泛使用的高级编程语言,它已成为前端开发的首选语言,并且在后端开发...在实际开发中,合理地集成这些代码段不仅可以提高代码的可维护性,还可以确保应用的性能不会因为引入过多第三方库而受到影响。

    12条有用的flex代码

    根据提供的文件信息,这里主要包含了12个与Flex编程相关的代码片段。虽然这些代码片段较为简短且不完全清晰,但仍然可以根据它们的功能进行一定的解释和扩展,以便更好地理解每一条代码所涉及的知识点。 ### 1. ...

    web最终版本.docx

    *盒阴影属性:`box-shadow`,水平偏移、垂直偏移、模糊距离、颜色 * 字符换行属性:`word-wrap`,强制换行长单词 * 转换属性:`transform`,旋转、缩放、透视 JavaScript 基础 * JavaScript 组成:核心...

    可以输入的下拉框,输入调接口,查询下拉框数据

    例如,React中可以使用`select`组件和第三方库如`react-select`,Vue中有`vue-select`等插件,它们都提供了自定义的搜索和过滤功能。 6. **用户体验优化**:为了提高用户体验,Filter Select还可以包含一些附加特性...

    CSS3仿电影文字标题动画特效.zip

    CSS3是层叠样式表(Cascading Style Sheets)的第三个版本,它引入了许多新的功能和特性,使得网页设计更加动态和富有表现力。 首先,CSS3中的关键帧动画(@keyframes)是实现这种文字动画的基础。通过定义动画的...

    通过CSS的滤镜实现火焰效果的示例

    第三步:让火焰动起来 为了让火焰看起来是动态的,需要创建多个小圆,并让它们在火焰形状的三角形中随机移动。这需要使用到CSS动画,特别是@keyframes规则和animation属性。通过设置小圆的随机位置和随机动画延迟,...

    Flashden41effect

    第41号特效可能涉及了如淡入淡出、旋转、缩放、移动、模糊、色彩变化等常见效果,也可能包含一些创新的动画逻辑。Flashden上的效果通常以AS2(ActionScript 2.0)或AS3(ActionScript 3.0)编写,这两种编程语言是...

    2021-2022计算机二级等级考试试题及答案No.11526.docx

    16. 在计算机内,多媒体数据最终以二进制代码的形式存在。 17. URL是Uniform Resource Locator的缩写,意为统一资源定位符。 18. 十六位字长的计算机并不意味着只能计算16位十进制数据,而是指CPU一次处理的数据...

    Java课程设计要求

    - **模糊查询**: 支持关键词匹配查询。 - **查询结果分页显示**: 分页展示查询结果。 - **数据增加、删除、修改**: 操作数据库记录。 - **权限判断**: 根据用户角色限制访问权限。 #### 四、课程设计成果要求 1. *...

    AfterEffects实例教程-教案.rar

    6. **第三方插件**:After Effects有一个庞大的插件生态系统。教程可能介绍一些常用的插件,如Trapcode Suite、Element 3D等,以及如何利用它们增强作品的表现力。 7. **实际案例分析**:通过分析具体的项目案例,...

    UniGUI集合说明

    - **创建安装程序**:可以使用第三方工具如Inno Setup等来创建安装包。 - **文档准备**:编写使用说明文档,帮助用户理解如何正确安装和使用DLL。 #### 6. uniGUI0.94以EXE形式发布程序的布署方法 发布UniGUI程序...

    计算机和编程语言

    - **人类与计算机的沟通差异**:人类在描述问题时往往非常直观和模糊,而计算机则需要明确、精确的指令才能执行任务。 - **示例**:“请给我一杯水”对人来说可能是一句简单的话,但对于计算机而言,需要将其分解为...

    软件项目需求调研报告模板.docx

    - **第三方服务集成**:集成支付平台、地图服务等第三方服务,增强系统的实用性和灵活性。 ### 五、非功能性需求描述 #### 系统环境需求 系统环境需求是指运行系统所需的硬件和软件环境。具体要求包括但不限于: ...

Global site tag (gtag.js) - Google Analytics