jQuery常用功能总结

1、提交form表单

    <form action="${ctx}/login/login.action?method=list" id="loginForm" name="loginForm">  
    </form>    
    function toLoginForm(){  
        var url = "${ctx}/login/login.action";  
        $('#loginForm').attr("action", url).submit();;  
    }  

 

2、注销退出

在top.jsp里实现退出

function logout(){
	if (confirm("确认要退出吗？")){
		$.ajax({
			type : "POST",
			url : "${ctx}/login/logoutSystem",
			error : function(){
				alert("出错了");
			},
			success : function(data){
				window.top.location.href = "${ctx}/login/getLoginView";
				return false;
			}
		});
	}
}

 

3、打开新窗口时，可以打开一个模式窗口，父页面控制子页面打开，子页面打开执行完操作后将自己关闭，父页面刷新自己，此方法需要提供一个公用的方法供其他页面调用。

 父页面：

function addNewStaff(){
	var url = "${ctx}/system/getAddStaffView";
	var status = showDialog(url,"",450,600); 
	if(status){
        window.location.href = "${ctx}/system/staff";
	}
}

 

公用方法：

function showDialog(url,args,width,height){  
    return showModalDialog(url, args, "dialogwidth:"+width+"px; dialogheight:"+height+"px;status:no;help:no;center:yes");  
}  

子页面，用到jquery.form.js插件，实现ajax提交表单，提交后把子页面关闭：

 $("#saveStaffForm").ajaxSubmit({
        type: 'post',
        url: "${ctx}/system/saveStaff" ,
        error: function(XmlHttpRequest, textStatus, errorThrown){
        	$("#error").text("保存出错了!");
        },
        success: function(data){
        	if(data.flag){
        		window.returnValue = true;
        		window.close();
            }else{
            	$("#error").text(data.data);
            }
        }
    });

 

4、获取多选框的值

var chk_value =[];
$('input[name="postId"]:checked').each(function(){
 	chk_value.push($(this).val());
});
alert(chk_value.length==0 ?'你还没有选择任何内容！':chk_value);

 

5、给多选框赋默认值，值从后台传过来

$(function(){
	var items = '${staffPost}';
    $.each(items, function (index, item) {
        $("input[name='postId']").each(function () {
            if ($(this).val() == item) {
                $(this).attr("checked",true);
            }
        });
    });
});

 

6、获取单选框的值

var value  = $('input[name="radioName"]:checked').val(); //获取被选中Radio的Value值

 

7、给dTree树增加多选框

原文来源：http://blog.csdn.net/xiaobaoxiaodun/article/details/6844314

 

8、获取元素的几种方式，来自http://blog.chinaunix.net/uid-26957269-id-3530689.html

 1、利用标签名获取元素
$("标签名")

2、通过ID获取元素
$("#id_name")

3、通过 类名获取元素
$(".className")

4、一次性获取多个元素
$("元素名, 元素名, 元素名 ....")

5、通过指定层次关系获取元素
$("祖先    子孙")
$("父  >  子")
$("前  +  后")
$("兄  ~  弟")

6、根据元素的属性值获取元素
[attribute]
[attribute = value]
[attribute != value]
[attribute ^= value]
[attribute $= value]
[attribute *= value]

7、通过过滤器获取元素
$("元素名：过滤器")

过滤器列表
:first
:last
:not(filter)
:even
:odd
:eq(index)
:lt(index)
:gt(index)
:header
:animated
:contains(text)
:empty
:has(selector)
:parent【注：这个是获取非空元素不是父元素】

8、获取表单元素
$("：表单过滤器名")

获取表单元素的方法
:input
:text
:password
:radio
:checkbox
:submit
:image
:reset
:button
:file
【注：表单标签也是标签，同样可以利用标签名获取，不过有些标签类型多样可以加过滤器加以区分。如：$("input:text")】

9、通过过滤器获取表单元素
:enable    获取可输入状态的元素
:disabled    获取不可输入状态的元素
:checked    获取选中元素的元素
:selected    获取下拉框中选中状态的元素

10、从集合元素中通过指定序号获取元素
$("元素名").eq(index)

11、获取指定条件一致的元素
$("元素名").filter(expr)

12、获取指定范围的元素
$("元素名").slice(start,[end])

13、获取与条件表达式一致的元素
$("元素名").is(expr)

14、获取元素的下一个元素
$("元素名").next([expr])

15、获取元素的前一个元素
$("元素名").prev([expr])

16、获取元素的父元素
$("元素名").parent([expr])

17、获取元素的子元素
$("元素名").children([expr])