jQuery经常使用方法

jQuery经常使用方法https://www.hellojava.com/article/84 (以为好用,就引用过来)

(1)AJAX请求

$(function() {
	$('#send').click(function() {
		$.ajax({
			type: "GET", //GET或POST,
			async:true, //默认设置为true，全部请求均为异步请求。
			url: "http://www.idaima.com/xxxxx.php",
			data: {
				username: $("#username").val(),
				content: $("#content").val()
			},
			dataType: "json", //xml、html、script、jsonp、text
			beforeSend:function(){},
			complete:function(){},
			success: function(data) {
				alert(data)
			},
			error:function(){},
		});
	});
});

(2) 如何获取checkbox，并判断是否选中

$("input[type='checkbox']").is(':checked') 
//返回结果：选中=true，未选中=false

(3) 获取checkbox选中的值

var chk_value =[]; 
$('input[name="test"]:checked').each(function(){ 
	chk_value.push($(this).val()); 
});

(4)checkbox全选/反选/选择奇数

$("document").ready(function() {
	$("#btn1").click(function() {
		$("[name='checkbox']").attr("checked", 'true'); //全选 
	}) $("#btn2").click(function() {
		$("[name='checkbox']").removeAttr("checked"); //取消全选 
	}) $("#btn3").click(function() {
		$("[name='checkbox']:even").attr("checked", 'true'); //选中全部奇数 
	}) $("#btn4").click(function() {
		$("[name='checkbox']").each(function() { //反选 
			if ($(this).attr("checked")) {
				$(this).removeAttr("checked");
			} else {
				$(this).attr("checked", 'true');
			}
		})
	})
})

(5)获取select下拉框的值

$("#select").val()

(6)获取选中值，三种方法均可以：

$('input:radio:checked').val()；
$("input[type='radio']:checked").val();
$("input[name='rd']:checked").val();

(7)设置第一个Radio为选中值：

$('input:radio:first').attr('checked', 'checked');

$('input:radio:first').attr('checked', 'true');

(8)设置最后一个Radio为选中值：

$('input:radio:last').attr('checked', 'checked');

$('input:radio:last').attr('checked', 'true');

(9)根据索引值设置任意一个radio为选中值：

$('input:radio').eq(索引值).attr('checked', 'true');//索引值=0,1,2....

$('input:radio').slice(1,2).attr('checked', 'true');

(10)根据Value值设置Radio为选中值

$("input:radio[value='rd2']").attr('checked','true');
$("input[value='rd2']").attr('checked','true');

(11)JQuery的父、子、兄弟节点查找方法

jQuery.parent(expr)           //找父元素

jQuery.parents(expr)          //找到全部祖先元素，不限于父元素

jQuery.children(expr)        //查找全部子元素，只会找到直接的孩子节点，不会返回全部子孙

jQuery.contents()            //查找下面的全部内容，包括节点和文本。

jQuery.prev()                //查找上一个兄弟节点，不是全部的兄弟节点

jQuery.prevAll()             //查找全部以前的兄弟节点

jQuery.next()                //查找下一个兄弟节点，不是全部的兄弟节点

jQuery.nextAll()             //查找全部以后的兄弟节点

jQuery.siblings()            //查找兄弟节点，不分先后

jQuery.find(expr)            //跟jQuery.filter(expr)彻底不同，jQuery.filter(expr)是从初始的

                          　　　　 jQuery对象集合中筛选出一部分，而jQuery.find()的返回结果，不会有初始集中

                          　　　　 筛选出一部分，好比：

                         　　　　$("p").find("span")是从元素开始找，等于$("p span")

(12) select选择值

1. $("#select_id").change(function(){//code...}); //为Select添加事件，当选择其中一项时触发
 
2. var checkText=$("#select_id").find("option:selected").text(); //获取Select选择的
 
3. var checkValue=$("#select_id").val(); //获取Select选择的Value
 
4. var checkIndex=$("#select_id ").get(0).selectedIndex; //获取Select选择的索引值
 
5. var maxIndex=$("#select_id option:last").attr("index"); //获取Select最大的索引值
 
jQuery添加/删除Select的Option项：
 
1. $("#select_id").append("<option value='Value'>Text</option>"); //为Select追加一个Option(下拉项)
 
2. $("#select_id").prepend("<option value='0'>请选择</option>"); //为Select插入一个Option(第一个位置)
 
3. $("#select_id option:last").remove(); //删除Select中索引值最大Option(最后一个)
 
4. $("#select_id option[index='0']").remove(); //删除Select中索引值为0的Option(第一个)
 
5. $("#select_id option[value='3']").remove(); //删除Select中Value='3'的Optiona
 
5. $("#select_id option[text='4']").remove(); //删除Select中Text='4'的Optiona
 
内容清空：$("#charCity").empty();