jquery选择器取值和url正则匹配

时间:2023-03-08 15:23:20
jquery选择器取值和url正则匹配

用到的简单jquery知识,简单总结一下,一是能加深自己的记忆,二是方便自己以后查看。常言道"好记性不如烂笔头",要养成常总结、常记录的好习惯。慢慢的发现jquery很有意思,很强大。我要学的还很多很多啊。

1、获取name="push_type"的input的radio的选项的值

  var push_type = $('[name="push_type"]:checked').val();

2、获取id="new_add_table0"的div下面input的name是以info_title开头的值

  var title0=$("#new_add_table0").find("input[name^='info_title']").val();

3、获取id="new_add_table0"的div下面textarea的name是以info_content开头的值

  var info0=$("#new_add_table0").find("textarea[name^='info_content']").val();

4、获取id="new_add_table0"的div下面select的name是以info_type开头的值

  var info_type0 = $("#new_add_table0").find("select[name^='info_type']").val();

5、js计算填写内容字符个数的函数

function strlen(str)
{
var len = 0;
for (var i=0; i<str.length; i++) {
var c = str.charCodeAt(i);
//单字节加1
if ((c >= 0x0001 && c <= 0x007e) || (0xff60<=c && c<=0xff9f)) {
len++;
}
else {
len+=3;//UTF-8下 汉字是3个字节 也可能是+2
}
}
return len;
}

6、js正则判断url

if(web_url)
{
  var r=/^http:\/\/[A-Za-z0-9]+\.[A-Za-z0-9]+[\/=\?%\-&_~`@[\]\':+!]*([^<>\"\"])*$/;
  if(r.test(web_url) == false)
  {
alert("请填写有效的链接地址");
return false;
  }
}
else
{
  alert("请填写有效的链接地址");
  return false;
}

7、js比较开始时间和结束时间的大小函数  

//将字符串转换为日期
var begin=new Date($("#fromdate").val().replace(/-/g,"/"));
var end=new Date($("#todate").val().replace(/-/g,"/"));
//js判断日期
if(begin-end>0)
{
alert("开始日期要在结束时间之前!");
return false;
}

8、如果一个生成的页面中有许多以"new_add_table"开头的div,例如new_add_table0,new_add_table1,new_add_table2...等,每一个div下面都有input的值,如果要取到值可以用jquery的each函数例如下面的

var odds =0;
$("#new_add_table div[id^='new_add_table']").each(function()//每一个id以new_add_table开头的div遍历
{
if($(this).find("input[name^='odds']").val())//子元素以input的name是odds开头的值
{
   odds+=parseInt($(this).find("input[name^='odds']").val());//每次获取的值转化为int类型 然后不断增加
}
});
//最终可以得到odds的和

9、js的each中的return false相当于php 中的break跳出循环 然后向下执行。如果each中如果有return false就终止执行可以这样来写

//多条标题、内容等
var istrue = true; //首先定义变量istrue为true;
$("#new_add_table div[id^='new_add_table']").each(function(){ //js开始遍历页面内容
  var info_type = $(this).find("select[name^='info_type']").val();
  var notice_type = $(this).find("select[name^='notice_type']").val();
  //标题信息
  var title = $(this).find("input[name^='info_title']").val();
  if(!title)
  {
  istrue = false; //如果有问题 直接把istrue的值修改成false,终止执行代码
  alert("标题信息为必填项");
  return false;
  }
  //网页链接地址
  var web_url=$(this).find("input[name^='page_link']").val();
  if(web_url)
  {
   var r= /^http:\/\/[A-Za-z0-9]+\.[A-Za-z0-9]+[\/=\?%\-&_~`@[\]\':+!]*([^<>\"\"])*$/;
   if(r.test(web_url) == false)
   {
     istrue = false;
     alert("请填写有效的链接地址");
    return false;
   }
  }
  else
  {
   istrue = false;
   alert("请填写有效的链接地址");
   return false;
  }
});
if(!istrue)
{
return false;
}

10、删除页面中的一个div或者其他

  $("#push_table").remove(); //直接可以删除页面元素

11、jquery修改元素显示属性

  $('#pic_package').css("display",""); //设置id为pic_package不显示

  $('#pic_package').attr("value",'');   //设置id为pic_package的值为空

  $("#pic_package").attr({"style":"width:600px;"}); // 之前的样式是 style:width:600px; display:none 去掉display:none

12、获取当前元素最近的一个父级的div的id

  var div_id = $(obj).closest("div").attr("id"); //获取上紧邻父级元素的id属性

13、克隆一个div下面的table并把它加载到某个地方

  $('#push_table').children('table').eq(0).clone(true).appendTo('#new_add_table');  //把id为push_table下面第一个table进行复制 并把复制的内容加载到id为new_add_table里面

   $("#push_table").clone(true).attr("id","new_add_table0").insertBefore($("#push_table"));  //复制id为push_table的元素给id为new_add_table0的里面并把复制的添加到模板的前面

14、修改radio的name属性

  $('#new_add_table input:radio[name="open_type"]').attr("name","open_type1");  //因为radio为单选项,如果复制,两组选项只能选择一个所以要修改radio的name这样才能正常选择。

  $('#push_table input:radio[name="open_type"][value=1]').attr("checked","checked"); //复制完模板的radio,模板的radio就没有选中状态了(估计是复制之后 后面的选项默认选择了,前面的选项就没有了)要恢复之前模板的选中状态

15、js判断正整数的正则

var r=/^[0-9]*[1-9][0-9]*$/;

if(r.test(val) == false)

{
alert("请填写1到100的整数"); $(obj).attr("value",''); return false;
}