最近在改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 是一个广泛使用的 JavaScript 库,它以简洁的语法和强大的功能著称,极大地简化了网页的DOM操作、事件处理和动画制作。"写的更少,但做的更多"是jQuery的核心理念,它允许开发者用相对较少的代码实现复杂的...
从给定的文件信息中,我们可以提炼出关于jQuery的一些核心知识点和使用技巧,这将帮助初学者和进阶用户更好地理解和应用jQuery库。 ### jQuery简介与安装 jQuery是一款流行的JavaScript库,它简化了HTML文档遍历、...
完整Jquery笔记总结,xmind思维导图文档,可以下载查看。
### jQuery 笔记详解 #### 一、简介 jQuery 是一款快速、简洁的 JavaScript 库,简化了 HTML 文档遍历、事件处理、动画以及 Ajax 交互等操作。它极大地提高了开发者编写 JavaScript 代码的效率,并且兼容各种...
jQuery笔记(上)涵盖了jQuery的基本用法,包括引入jQuery库、选择器的使用、事件监听与处理,以及简单的动态效果实现。这些基础知识为后续深入学习jQuery提供了坚实的基础。通过学习和实践,开发者可以更加高效地...
jquery 选择器 jquery 是一个快速简单的javascript library 简化了html文件 ,动画,ajax 。方便了网页技术的快速发展
《锋利的jQuery笔记》是一份深入探讨jQuery库的宝贵资料,它主要针对JavaScript开发者,尤其是那些希望提升jQuery技能的人员。jQuery是一个轻量级、高性能的JavaScript库,它的核心功能在于简化HTML文档遍历、事件...
这个“jquery笔记.rar”文件很可能是对jQuery库的深入学习和实践总结。 **DOM操作** 1. **选择器**: jQuery提供了一套强大的选择器,如ID选择器(#id)、类选择器(.class)和元素选择器(element),以及组合选择...
首先,我们来看看"韩顺平AJAX和jQuery笔记整理.doc"。AJAX(Asynchronous JavaScript and XML)是一种创建动态网页的技术,而jQuery对AJAX提供了出色的封装,使得异步数据交换变得更加简单。在这个文档中,你将了解...
《圣思园 jQuery 笔记详解》 jQuery,作为一款强大的JavaScript库,它的出现极大地简化了JavaScript的DOM操作,使得网页动态化和交互性开发变得更加便捷。本文将深入探讨jQuery的选择器、过滤选择器及其在实际应用...
《jQuery笔记详解》 jQuery,作为JavaScript的一个库,极大地简化了DOM操作,提升了开发者的工作效率。它将常用的功能进行了封装,形成了一系列API,使得开发者无需关注底层实现,只需调用相应的方法即可实现复杂...
《jQuery学习笔记详解》 jQuery 是一款强大的JavaScript库,它极大地简化了JavaScript的DOM操作、事件处理、动画设计和Ajax交互。本笔记基于一年的学习经验,涵盖了基础到进阶的知识点,旨在帮助初学者快速掌握...
### 韩顺平AJAX和jQuery笔记整理 #### AJAX概览 - **定义**:Asynchronous JavaScript and XML(异步JavaScript与XML),是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。 - **运行原理**: - ...
JS-Ajax-jQuery笔记,学习笔记,JavaScript,JS-Ajax-jQuery笔记,学习笔记,JavaScript,