`

jquery笔记

 
阅读更多
最近在改bug,涉及到很多前端验证的问题,整理了一下。


1.bind使用:

bind(type,[data],fn)为每一个匹配元素的特定事件(像click)绑定一个事件处理器函数。这个事件处理函数会接收到一个事件对象,可以通过它来阻止(浏览器)默认的行为。如果既想取消默认的行为,又想阻止事件起泡,这个事件处理函数必须返回false。多数情况下,可以把事件处理器函数定义为匿名函数(见示例一)。在不可能定义匿名函数的情况下,可以传递一个可选的数据对象作为第二个参数(而事件处理器函数则作为第三个参数),见示例二。
返回值 : jQuery
参数 :
type (String) : 事件类型
data (Object) : (可选) 作为event.data属性值传递给事件对象的额外数据对象
fn ( Function) : 绑定到每个匹配元素的事件上面的处理函数
示例 : 当每个段落被点击的时候,弹出其文本。
jQuery 代码:
$("p").bind("click", function(){
  alert( $(this).text() );
});
--------------------------------------------------------------------------------
你可以在事件处理之前传递一些附加的数据。
jQuery 代码:
[code="java"]
function handler(event) {
  alert(event.data.foo);
}
$("p").bind("click", {foo: "bar"}, handler)

--------------------------------------------------------------------------------
通过返回false来取消默认的行为并阻止事件起泡。
jQuery 代码:
[code="java"]
$("form").bind("submit", function() { return false; })

--------------------------------------------------------------------------------
通过使用 preventDefault() 方法只取消默认的行为。
jQuery 代码:
[code="java"]
$("form").bind("submit", function(event){
  event.preventDefault();
});

--------------------------------------------------------------------------------
通过使用 stopPropagation() 方法只阻止一个事件起泡。
jQuery 代码:
$("form").bind("submit", function(event){
  event.stopPropagation();
});



=====================华丽的分割线===============================================

2.ajax 提交问题:

$.ajax({
			type:"get",
			url:"del/checkDeleteForIds.do",
			data:value,
			complete:function(data){
				var aa = eval("("+data.responseText+")");
				if(aa.msg==0) {//无用户
					tipShow('#delMsgTip');
				}else if (aa.msg==2) {
					$("#DeleteWithUserButton").attr("style","display:none");
					tipShow('#alertNoSelect');
				}else {//有用户
					$("#roleNames").text(aa.roleNames);
					$("#DeleteRolesButton").attr("style","display:none");
					tipShow('#delMsgTipWithUsers');
				}
			}	
		});



上面用success的时候就不行,改为complete就可以了。有点诡异,现在还不知道为什么。

---------------------
$("#roleNames").text(aa.roleNames);
//这个方法可以将后台传过来的数据赋给id=roleNames的dom。


-----------------

$("#DeleteRolesButton").attr("style","display:none");
//attr 将属性值赋给dom对象。


---------------------

对应后台java代码:springMVC 返回json对象
@RequestMapping("/role/del/checkDeleteForIds.do")
	public void checkDeleteForIds(int[] ids, HttpServletRequest request,HttpServletResponse response, ModelMap model) throws IOException {
		if(ids==null) {
			ResponseUtils.printJson(response,"{success:true,msg:2}");
			return;
		}
		String roleNames="";
		for(int i=0;i<ids.length;i++) {
			if(pmsRoleBO.checkUserByRoleId(ids[i])) {
				roleNames = pmsRoleBO.getNameByRoleIds(ids) + " ";
			}
		}
		if(roleNames.equals("")) {//所选角色下无用户
			ResponseUtils.printJson(response,"{success:true,msg:0}");
		} else {//角色下有用户
			model.addAttribute("roleNames", roleNames);
			ResponseUtils.printJson(response,"{success:true,msg:1,roleNames:'"+roleNames+"'}");
		}
	}


public static void printJson(HttpServletResponse response, String text)
	throws IOException {
     print(response, "application/json;charset=UTF-8", text);
}


private static void print(HttpServletResponse response, String contentType,
			String text) throws IOException {
		response.setContentType(contentType);
		response.setHeader("Pragma", "No-cache");
		response.setHeader("Cache-Control", "no-cache");
		response.setDateHeader("Expires", 0);
		PrintWriter pw = response.getWriter();
		pw.write(text);
		pw.close();
	}


===================================华丽的分割线==================================

还是分开记录吧,每个问题开一个文章,这样好找些。


分享到:
评论

相关推荐

    jQuery笔记

    jQuery 是一个广泛使用的 JavaScript 库,它以简洁的语法和强大的功能著称,极大地简化了网页的DOM操作、事件处理和动画制作。"写的更少,但做的更多"是jQuery的核心理念,它允许开发者用相对较少的代码实现复杂的...

    JQuery笔记JQuery笔记

    从给定的文件信息中,我们可以提炼出关于jQuery的一些核心知识点和使用技巧,这将帮助初学者和进阶用户更好地理解和应用jQuery库。 ### jQuery简介与安装 jQuery是一款流行的JavaScript库,它简化了HTML文档遍历、...

    jquery笔记总结

    完整Jquery笔记总结,xmind思维导图文档,可以下载查看。

    jquery笔记详细

    ### jQuery 笔记详解 #### 一、简介 jQuery 是一款快速、简洁的 JavaScript 库,简化了 HTML 文档遍历、事件处理、动画以及 Ajax 交互等操作。它极大地提高了开发者编写 JavaScript 代码的效率,并且兼容各种...

    jQuery笔记(上)

    jQuery笔记(上)涵盖了jQuery的基本用法,包括引入jQuery库、选择器的使用、事件监听与处理,以及简单的动态效果实现。这些基础知识为后续深入学习jQuery提供了坚实的基础。通过学习和实践,开发者可以更加高效地...

    jquery 笔记

    jquery 选择器 jquery 是一个快速简单的javascript library 简化了html文件 ,动画,ajax 。方便了网页技术的快速发展

    锋利的jquery笔记

    《锋利的jQuery笔记》是一份深入探讨jQuery库的宝贵资料,它主要针对JavaScript开发者,尤其是那些希望提升jQuery技能的人员。jQuery是一个轻量级、高性能的JavaScript库,它的核心功能在于简化HTML文档遍历、事件...

    jquery笔记.rar

    这个“jquery笔记.rar”文件很可能是对jQuery库的深入学习和实践总结。 **DOM操作** 1. **选择器**: jQuery提供了一套强大的选择器,如ID选择器(#id)、类选择器(.class)和元素选择器(element),以及组合选择...

    韩顺平jquery学习笔记及练习

    首先,我们来看看"韩顺平AJAX和jQuery笔记整理.doc"。AJAX(Asynchronous JavaScript and XML)是一种创建动态网页的技术,而jQuery对AJAX提供了出色的封装,使得异步数据交换变得更加简单。在这个文档中,你将了解...

    圣思园 jQuery笔记

    《圣思园 jQuery 笔记详解》 jQuery,作为一款强大的JavaScript库,它的出现极大地简化了JavaScript的DOM操作,使得网页动态化和交互性开发变得更加便捷。本文将深入探讨jQuery的选择器、过滤选择器及其在实际应用...

    自己整理的jQuery笔记

    《jQuery笔记详解》 jQuery,作为JavaScript的一个库,极大地简化了DOM操作,提升了开发者的工作效率。它将常用的功能进行了封装,形成了一系列API,使得开发者无需关注底层实现,只需调用相应的方法即可实现复杂...

    我的JQuery笔记.doc

    《jQuery学习笔记详解》 jQuery 是一款强大的JavaScript库,它极大地简化了JavaScript的DOM操作、事件处理、动画设计和Ajax交互。本笔记基于一年的学习经验,涵盖了基础到进阶的知识点,旨在帮助初学者快速掌握...

    韩顺平AJAX和jquery笔记整理

    ### 韩顺平AJAX和jQuery笔记整理 #### AJAX概览 - **定义**:Asynchronous JavaScript and XML(异步JavaScript与XML),是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。 - **运行原理**: - ...

    JS-Ajax-jQuery笔记1

    JS-Ajax-jQuery笔记,学习笔记,JavaScript,JS-Ajax-jQuery笔记,学习笔记,JavaScript,

Global site tag (gtag.js) - Google Analytics