jq模糊匹配

最新推荐文章于 2022-05-18 08:00:00 发布

weixin_30525825

最新推荐文章于 2022-05-18 08:00:00 发布

阅读量409

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/shaozhu520/p/10689337.html

版权

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+'"οnclick="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="添加" οnclick="add()"/>
<div id="temp">
//用于放置添加的内容
</div>
</body>
</html>

转载于:https://www.cnblogs.com/shaozhu520/p/10689337.html

weixin_30525825

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jq模糊匹配

jq是一般程序员在前台开发的时候都会使用的技术，其中模糊匹配查询在动态添加标签的时候经常用到，这里我写出我经常用到的几个模糊匹配的方法。其中有:^(前缀)、$(后缀)、*(包含)例如有这样一段代码：<div> <input id="id1" type="text" name="name1" value="1" id_temp="haha"/> &...
复制链接

扫一扫