jquery 学习笔记

索引
1.checkbox相关操作
2.js强制按数字计算
3.jquery将字符串转换为json对象
4.jquery获取选中radio值
5.jquery简单的奇偶行变色
6.jquery获取radio选中值
7.js操作json集合
8.jquery彻底清除dom元素
9.jquery延迟mouseover,mouseout事件
10.iframe中调用父窗口js方法
11.jquery点击行选中checkbox
12.jquery ajax 从后台获取 数字 前台 显示空
13.jquery 去掉内容左右的空格
14.字符串转json对象
15.jquery.cookie插件相关操作

1.checkbox相关操作
jquery判断checkbox选中个数，如果大于五个，不能选
就这一小段代码花了我三个小时......

  var inputs = $("#checkboxTd input[name='profession']");
  inputs.bind("click",function(){
      if($("#checkboxTd input:checked").length>5){
          $(this).removeAttr("checked");
      }
  });

作用是name为profession的checkbox最多能选择五个

新版的jquery,判断checkbox选中和取消选中时,使用:$('#id').prop('checked')==true表示选中
全选和取消全选操作,使用$("input[type='checkbox']").prop("checked",$("#id").prop("checked"));

2.js 强制按数字计算

var a = "1";
var b = "2";
alert(a+b);// 输出"12"
alert((+a)+(+b));// 输出"3"

3.jquery将字符串转换为json对象

var d = $.parseJSON(data); // 需要注意的是,data的格式必须为{"key":"value","type":"1"}

4.jquery获取选中radio值

var row = $(":radio[checked='true']").val();

5.jquery简单的奇偶行变色

$("#tab_new tr:even").css("background-color","#fafafb");// tab_new 表格tbody的id

6.jquery获取radio选中值

var radio = $(":radio:checked").val();// 这种更简单些

7.js操作json集合

data.pop(); //移除最后一个元素并返回该元素值 
data.shift(); //移除最前一个元素并返回该元素值，数组中元素自动前移 
data.splice(deletePos,deleteCount); //删除从指定位置deletePos开始的指定数量deleteCount的元素，数组形式返回所移除的元素 

8.jquery彻底清除dom元素

function clean(id){
	$.each($("#"+id).children(),function(){
		$.event.remove(this);// 清除绑定的事件
		$.removeData(this);// 清除jquerydata
	});
	$("#"+id).empty();// 清空子元素
}

9.jquery延迟mouseover,mouseout事件

jQuery(document).ready(function($) {
    var delayTime = [];
    jQuery('li.mainlevel').each(function(index) {
        $(this).hover(function() {
            var _self = this;
            delayTime[index] = setTimeout(function() {
                $(_self).find('ul:eq(0)').slideDown(200)
            },
            400)
        },
        function() {
            clearTimeout(delayTime[index]);
            $('ul', this).slideUp(200)
        })
    });
});

10.iframe中调用父窗口js方法

window.parent.function();

 

11.jquery点击行选中checkbox

var row = {
	rowClick:function(table,checkboxName){
		$("#"+table).find("tr td").click(function(){
			var cbk = $(this).parent().find("input[name='"+checkboxName+"']");
			if(cbk.data("cbk")==0){
				cbk.data("cbk",1);
				cbk.attr("checked",false);
			}else{
				cbk.data("cbk",0);
				cbk.attr("checked",true);
			}
		});
	}
};
调用时,直接使用row.rowClick("tbodyName","checkboxName");

 

12.jquery ajax 从后台获取 数字 前台 显示空
　　很奇怪的问题,明明从后台获取到的是一个数字,在前台alert()这个数字的时候,竟然是""

response.getWriter().write(projectService.checkProjectNumber(projectNumber));// 写一个数字到前台
response.getWriter().write(projectService.checkProjectNumber(projectNumber)+"");// 写一个字符串到前台,用这个可以,把数字转换为字符串

 

13.jquery 去掉内容左右的空格
　　

$(function(){
　　$("input,textarea").blur(function(){
　　　　$(this).val($.trim($(this).val()));  // $.trim(str);去掉str空格
　　});
});// 这段代码意思是,给所有的input和文本域加上焦点离开事件,焦点离开时,去掉文本框内容两边的空格

14.字符串转json对象

JSON.parse(data);

15.jquery.cookie插件相关操作

$.cookie("user","xxxxxxxx", {expires:7, path:"/"});//设置cookie,7天过期
$.cookie("user");// 获取设置的cookie
$.cookie("user",null, {path:"/"});// 清除cookie

　　

jquery 相关其他文章:jquery 选择器