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();
相關文章
相關標籤/搜索