JQuery 简单用法

近段时间重新温习了JQuery的基本用法，发现好记性不如烂笔头，现将这段时间温习的内容记录下来，以供以后学习和使用

$(function() {
	/** 点击事件 */
	/**
	$("p").css("color","blue");
	$("p.clickvanish").click(function(){
		$(this).hide();
	});
	$("#div2 p").nextUntil("strong").css("color","red");
	*/
	// ----------------------淡入淡出显示隐藏----------------------------------------
	$("#btn").click(function(){
		//alert($("p.clickvanish").size());
		for(var i=0;i<$("p.clickvanish").size();i++){
			if($("p.clickvanish").eq(i).is(':visible')){
				$("p.clickvanish").eq(i).hide(2000);
				continue;
			}else{
				$("p.clickvanish").eq(i).show(2000);
			}
		}
	});
	$("#tb tr:even").css("background-color","#B2E0FF");
	
	// ----------------------向上向下显示隐藏----------------------------------------
	//$("#hdd").hide();
	$("#flip").click(function(){
		$("#hdd").css("color","red").slideDown(3000).slideUp(3000);		
	});
	
	// ---------------------表添加行--------------------------------------------------
	$("#btn_add").click(function(){
		var tr_id = $("#tb tr:last").attr("id");
		var index = 1;
		if(tr_id){
			index = parseInt(tr_id.substr(2,tr_id.length-1))+1;
		}
		var row = '<tr id="tr'+index+'"><td><input type="checkbox" name="ckb"/></td><td id="td'+index+'">王'+index+'</td><td>3'+index+'</td></tr>';		
		$('#tb').append(row);
		$("#tb tr:even").css("background-color","#B2E0FF");
		// 重新添加全选事件
		selectOrCancleCbk();
	});
	// 添加全选事件
	selectOrCancleCbk();
	// 添加删除表记录事件
	$("#btn_del").click(function(){
		removeRow();		
	});

	// 全选或者取消
	function selectOrCancleCbk(){
		$('#ckbAll').click(function(){
			if($('#ckbAll').is(':checked')){
				$('input[name="ckb"]').prop("checked",true);
			}else{
				$('input[name="ckb"]').prop("checked",false);
			}
		});
	}
	// 删除表行记录
	function removeRow(){
		$("input[type='checkbox'][name='ckb']:checked").each(function(){
			// 获取已经选择的所有checkBox
			n = $(this).parents("tr").index();  // 获取checkbox所在行的顺序
            $("table#tb").find("tr:eq("+n+")").remove();
		});
	}
	
	function addTrClick(){
		alert($(this).attr("id"));
	}
	function addTdClick(){
		alert($(this).attr("id"));
	}
	
	// ---------------------修改Value值-----------------------------------------------
	$("#btn1").click(function(){
		$("#test1").text("hello world!");
	});
	$("#btn2").click(function(){
		$("#test2").html("<strong>hello world!</strong>");
	});
	$("#btn3").click(function(){
		$("#test3").val("hello world!");
	});
	$("#btn4").click(function(){
		alert($("#href1").attr("href"));
		$("#href1").attr("href","http://mail.163.com");
		
	});
	
	// ---------------------修改选择框值-----------------------------------------------
	
	$("input[name=sex]").each(function(){
		if($(this).attr("checked")){
			// alert('选中');
			//$(this).remove();
		}else{
			// alert('未选中');
		}
	});
	
	$('input:radio:not([checked])').attr("disabled","disabled");
	
	
	//  ---------------------ajax值----------------------------------------------------
	  
	$('#btn_ajax').click(function(){
		$('#div_ajax').load('ajax_data.txt');
	});
	
	$('#btn_ajax_cbk').click(function(){
		$('#div_ajax').load('ajax_data.txt',function(responseTxt,statusTxt,xhr){
			
			if(statusTxt=='success'){
				alert('success'+xhr.status+": "+xhr.statusText);
				
			}
			if(statusTxt == 'error'){
				alert('error'+xhr.status+": "+xhr.statusText);
			}
		});
	});
	
	$('#btn_ajax_get').click(function(){
		
		$.get('ajax_data.asp',function(data){
			//alert("数据：" + data + "\n状态：" + status);
			//$('#div_ajax').html(data);
			alert(data);
		});
	});
	 
	$('#btn_ajax_post').click(function(){
		$.post(
			'ajax_data.asp',
			{
				name:"Donald Duck",
				city:"Duckburg"
			},
			function(data,status){
				// alert("Data: " + data + "\nStatus: " + status);		
			})	
	});	
});