图灵学院--Java高级架构师-互联网企业级实战VIP课程(价值6380)(qq:1324981084)

jq是一般程序员在前台开发的时候都会使用的技术,其中模糊匹配查询在动态添加标签的时候经常用到,这里我写出我经常用到的几个模糊匹配的方法。

其中有:^(前缀)、$(后缀)、*(包含)

例如有这样一段代码:

<div>
<input id="id1" type="text" name="name1" value="1" id_temp="haha"/>
<input id="id2" type="text" name="name2" value="2"/>
<input id="id3" type="text" name="name3" value="3" />
<input id="id4" type="text" name="name4" value="4"/>
</div>

1、利用id获得id1的value值

var id1_value = $("#id1").val() ;
var id1_value1 = $(input:text[id='id1']).val();//获得id等于id1的text文本的值
//var id1_value1 = $(input:text[name='name1']).val();//获得name等于name1的text文本的值

2、利用attr()方法获得任意属性的值

var attr_value = $("#id1").attr("id_temp");

3、按name值的前缀进行匹配,返回一个包含input所有属性的的jq对象

$(input:text[name^='name'])

4、按name的后缀进行匹配

$(input:text[name$='name'])

5、按name是否包含某些字母进行匹配

$(input:text[name*='nam'])

例子3、4、5都是模糊匹配,返回的是一个jq的集合对象,所以需要用jq提供的方法取出所需要的值。方法如下:

.each(function(i,n){
//i会循环出匹配到的jq对象的个数,i从0开始
//n是匹配到的jq对象,取值为n.id,这样就会把id的值取出来
});
<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.js">
</script>
<script>
//添加内容,拼接想要添加的内容
function add(){
var num = $("#num").val();
var temp = '<input type="text" id="id'+num+'" name="name'+num+'"/>'+
'<input type="button" value="删除" id="delete_id'+num+'"onclick="delete1(this.id)"/></br>';
$("#temp").append(temp);//将拼接好的字符串添加到预备好的位置
$("#num").val(++num)
}
//利用id删除一行数据
function delete1(id){
var text_id = id.replace("delete_","");
$("#"+text_id).remove();
$("#"+id).next().remove();
$("#"+id).remove();
//模糊匹配将id和name进行重新赋值
$("input[id^='id']").each(function(i,n){
$("#"+n.id).attr("id","id"+i);
$("#"+n.id).attr("name","name"+i);
});
$("input[id^='delete_id']").each(function(i,n){
$("#"+n.id).attr("id","delete_id"+i);
});
var num = $("#num").val();
$("#num").val(--num);
}
</script>
</head>
<body>
<input tuype="text" id="num" value="0"/>
<input type="button" value="添加" onclick="add()"/>
<div id="temp">
//用于放置添加的内容
</div>
</body>
</html>

jq模糊匹配的更多相关文章

  1. jq模糊匹配(qq:2798641729)

    图灵学院--Java高级架构师-互联网企业级实战VIP课程(价值6380)(qq:1324981084) jq是一般程序员在前台开发的时候都会使用的技术,其中模糊匹配查询在动态添加标签的时候经常用到, ...

  2. EasyUi模糊匹配搜索框combobox

    现在项目当中很多已经应用了Jquery-easyUi这个界面框架了,所以,学习一点easyUI的常用工具就显得很重要了,现在介绍的就是我在项目中用到的easyUi的模糊匹配组合框combobox. c ...

  3. 1035-Spell checker(模糊匹配)

    一,题意: 给出一组字典的单词,以'#'结束,之后给出一组要执行模糊匹配的单词序列,以'#'结束 1,若某个单词能在字典中找到,则输出corret 2,若某个单词能通过 变换 或 删除 或 添加一个字 ...

  4. sql模糊匹配中%、_的处理

    防sql注入之模糊匹配中%._处理: StringBuilder sbSql = new StringBuilder(); sbSql.Append(@"SELECT * from tabl ...

  5. 记一个同时支持模糊匹配和静态推导的Atom语法补全插件的开发过程: 序

    简介 过去的一周,都睡的很晚,终于做出了Atom上的APICloud语法提示与补全插件:apicloud_autocomplete.个中滋味,感觉还是有必要记录下来的.代码基于 GPL-3.0 开源, ...

  6. 茗洋Easy UI 1.3.2 部分问题解决系列专题[Combo模糊匹配中文问题 修复]

    本次给大家带来的EasyUI的我研究拓展的新特性 我使用的是  EasyUI 1.3.2版本的,项目是ASP.NET MVC3,但是本篇讲解用不上ASP.NET MVC,仅仅修改官方Demo你就知道怎 ...

  7. Mysql 模糊匹配和转义字符

    首先创建一个测试表: insert into test(tt) values('\\\\172.18.28.153'); 现在我想使用模糊匹配,查出以 “\\172” 开头的字符串. 需要使用like ...

  8. grep是模糊匹配

    1. 我:我用的ps -nat|grep -i "80"|wc -l命令 我:解释详细点,,龙哥,对于我这种菜鸟:也是模糊匹配 :你用 grep "80" 会匹 ...

  9. ExtJs combobox支持模糊匹配

    其实很简单,我们只需要在创建下拉框时,给下拉框添加一个监听事件,代码如下:   //以下监听事件用于对下拉项进行模糊匹配                     ,listeners:{       ...

随机推荐

  1. oracle中sql语句的优化

    oracle中sql语句的优化 一.执行顺序及优化细则 1.表名顺序优化 (1) 基础表放下面,当两表进行关联时数据量少的表的表名放右边表或视图: Student_info   (30000条数据)D ...

  2. 【jar包】JSON之解析利器GSON--【gson-2.2.4.jar】

    Gson(又称Google Gson)是Google公司发布的一个开放源代码的Java库,主要用途为串行化Java对象为JSON字符串,或反串行化JSON字符串成Java对象.GSON核心jar包不到 ...

  3. Moon.Orm 5.0 (MQL版)

    Moon.Orm 5.0 (MQL版) 实战实例Moon.Orm 5.0 革命性的设计 打造最便捷的异步分页技术(提供下载) 摘要: 一.建一个项目(以WebForm为例)配置文件配置(注意您自己的路 ...

  4. Mysql个人语句笔记

    --一些简单语句记录: /*mysql*/SHOW DATABASES CREATE DATABASE guoDROP DATABASE guo /*查看创建的数据库*/SHOW CREATE DAT ...

  5. 什么是PHP

    PHP(PHP: Hypertext Preprocessor的缩写,中文名:“超文本预处理器”)是一种通用开源脚本语言.语法吸收了C语言.Java和Perl的特点,入门门槛较低,易于学习,使用广泛, ...

  6. ASP.NET MVC + 百度富文本编辑器 + EasyUi + EntityFrameWork 制作一个添加新闻功能

    本文将交大伙怎么集成ASP.NET MVC + 百度富文本编辑器 + EasyUi + EntityFrameWork来制作一个新闻系统 先上截图: 添加页面如下: 下面来看代码部分 列表页如下: @ ...

  7. Date的使用

    方法 说明 Date() 返回当日的日期和时间 getDate() 获取当天(1-31) getDay() 获取当天的星期(0-6) getMonth() 获取月份(0-11) getFullYear ...

  8. [转]Android与电脑局域网共享之:Samba Server

    大家都有这样的经历,通过我的电脑或网上邻居访问另一台计算机上的共享资源,虽然电脑和手机之间可以有多种数据传输方式,但通过Windows SMB方式进行共享估计使用的人并不是太多,下面我就简单介绍一下, ...

  9. [置顶] 网页提交方式post和get的区别和联系

    都知道GET一般用于获取/查询资源信息,而POST一般用于更新资源信息.但具体区别呢?可以互换吗? 主要区别有:1传输数据的方式不同,2传输的数据多少不同,3传输数据的安全性不同4,后台获取数据的方式 ...

  10. .net winForm 实现类似qq 弹出新闻

    .net winForm 实现类似qq 弹出新闻   一.背景: echong 之前一直用 公司大牛c语言写的一个弹出托管,前几天写东西的时候发现com调用不是那么好使.而手头上写的这个东西又是.ne ...