jQuery和Ajax的使用(杂记)
在jsp文件的获取绝对路径标签,其他jsp文件调用就行了
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<base href="${pageContext.request.scheme }://${pageContext.request.serverName }:${pageContext.request.serverPort }${pageContext.request.contextPath}/">
<!-- 其内容先后为:完全的绝对路径:http://.... -->
1.
$(function(){
//范围查询时,页面顺利跳转
//$("a").click(function(){
// var serializeVal=$(":hidden").serialize(); 序列化处理
// var href=this.href+"&"+serializeVal;
// window.location.href=href;
// return false;
//}); //转到? 页,处理
$("#pageNo").change(function(){
var val = $(this).val();
//去空格
val = $.trim(val); //1. 校验 val 是否为数字 1, 2, 而不是 a12, b,使用正则表达式
var flag = false;
var reg = /^\d+$/g;
var pageNo = 0; if(reg.test(val)){
//2. 校验 val 在一个合法的范围内: 1-totalPageNumber
pageNo = parseInt(val);
if(pageNo >= 1 && pageNo <= parseInt("${bookpage.totalPageNumber }")){
flag = true;
}
}
if(!flag){
alert("输入的不是合法的页码.");
$(this).val("");
return;
}
//3. 页面跳转
var href = "bookServlet?method=getBooks&pageNo=" + pageNo + "&" + $(":hidden").serialize();
window.location.href = href;
});
})
2.
$(function(){
//删除数据的按钮
$(".delete").click(function(){
var $tr=$(this).parent().parent();
var title=$.trim($tr.find("td:first").text());
var flag=confirm("确定要删除"+title+"的信息吗?"); if(flag){
return true;
}
return false;
}); //ajax 修改单个商品的数量:
//1. 获取页面中所有的 text, 并为其添加 onchange 响应函数. 弹出确认对话框: 确定要修改吗?
//在里面输入0,则表示要删除该书
$(":text").change(function(){
var quantityVal=$.trim(this.value); //校验输入的是否合法,即为数字
var flag=false;
var reg=/^\d+$/g;
var quantity=-1;
if(reg.test(quantityVal)){
quantity=parseInt(quantityVal);
if(quantity>=0){
flag=true;
}
}
//如果输入的数为0或,小于0时,原来的值不变
if(!flag){
alert("输入的数量不合法!!!");
//不合法,就恢复
$(this).val($(this).attr("class"));
return;
} //弹出,是否要确定删除 文本框
var $tr=$(this).parent().parent();
var title=$.trim($tr.find("td:first").text()); if(quantity==0){
var flag2=confirm("你确定要删除"+title+"吗?");
if(flag2){
//得到了 a 节点
var $a=$tr.find("td:last").find("a");
//执行 a 节点的 onclick 响应函数.
$a[0].onclick();
return ;
}
}
//修改单个商品的数量:
var flag=confirm("你确定要修改"+title+"的数量吗?"); if(!flag){
$(this).val($(this).attr("class"));
return ;
}
//2. 请求地址为: bookServlet
var url="bookServlet"; //3. 请求参数为: method:updateItemQuantity, id:name属性值, quantity:val, time:new Date()
var idVal=$.trim(this.name);
var args = {"method":"updateItemQuantity", "id":idVal, "quantity":quantityVal, "time":new Date()}; //4. 在 updateItemQuantity 方法中, 获取 quanity, id, 再获取购物车对象, 调用 service 的方法做修改
//5. 传回 JSON 数据: bookNumber:xx, totalMoney //6. 更新当前页面的 bookNumber 和 totalMoney
$.post(url, args, function(data){
var bookNumber = data.bookNumber;
var totalMoney = data.totalMoney; $("#totalMoney").text("总金额: ¥" + totalMoney);
$("#bookNumber").text("您的购物车中共有" + bookNumber + "本书");
},"JSON"); }); })
3.
jQuery和Ajax的使用(杂记)的更多相关文章
- jQuery之ajax实现篇
jQuery的ajax方法非常好用,这么好的东西,你想拥有一个属于自己的ajax么?接下来,我们来自己做一个简单的ajax吧. 实现功能 由于jq中的ajax方法是用了内置的deferred模块,是P ...
- 【原创经验分享】JQuery(Ajax)调用WCF服务
最近在学习这个WCF,由于刚开始学 不久,发现网上的一些WCF教程都比较简单,感觉功能跟WebService没什么特别大的区别,但是看网上的介绍,就说WCF比WebService牛逼多少多少,反正我刚 ...
- jQuery版AJAX简易封装
开发过程中,AJAX的应用应该说非常频繁,当然,jQuery的AJAX函数已经非常好用,但是小编还是稍微整理下,方便不同需求下,可以简化输入参数,下面是实例代码: $(function(){ /** ...
- JS原生ajax与Jquery插件ajax深入学习
序言: 近来随着项目的上线实施,稍微有点空闲,闲暇之时偶然发现之前写的关于javascript原生xmlHttpRequest ajax方法以及后来jquery插件ajax方法,于是就行了一些总结,因 ...
- 重写jquery的ajax方法
//首先备份下jquery的ajax方法 var _ajax=$.ajax; //重写jquery的ajax方法 $.ajax=function(opt){ //备份opt中error和success ...
- Jquery通过Ajax方式来提交Form表单
今天刚好看到Jquery的ajax提交数据到服务器的方法,原文是: 保存数据到服务器,成功时显示信息. jQuery 代码: $.ajax({ type: "POST", url: ...
- 对jquery的ajax进行二次封装以及ajax缓存代理组件:AjaxCache
虽然jquery的较新的api已经很好用了, 但是在实际工作还是有做二次封装的必要,好处有:1,二次封装后的API更加简洁,更符合个人的使用习惯:2,可以对ajax操作做一些统一处理,比如追加随机数或 ...
- jquery管理ajax异步-deferred对象
今天跟大家分享一个jquery中的对象-deferred.其实早在jquery1.5.0版本中就已经引入这个对象了.不过可能在实际开发过程中用到的并不多,所以没有太在意. 这里先不说deferred的 ...
- Struts2 使用jQuery实现Ajax
在jQuery中将Ajax相关的操作进行封装,使用时只需在合适的地方调用Ajax相关的方法即可,相比而言,使用jQuery实现Ajax更加简洁,方便 1.$.Ajax()可以通过发送Http请求加载远 ...
- JQuery中Ajax的操作
JQuery Ajax异步操作的方式: $.ajax,$.post, $.get, $.getJSON. 一, $.ajax,这个是JQuery对ajax封装的最基础步,通过使用这个函数可以完成异 ...
随机推荐
- linux笔记八---------文件查找
1.find文件查找指令 > find 目录 参数 参数值,参数 参数值..... > find / -name passwd //从系统根目录开始递归查找name=p ...
- 20145334赵文豪 《Java程序设计》第4周学习总结
20145334赵文豪 <Java程序设计>第4周学习总结 教材学习内容总结 第六章知识点总结 1-继承共同行为:如果在程序设计上存在着重复,那就需要修改,可以吧相同的程序代码提升(pul ...
- Network | UDP checksum
1. 校验和 ICMP,IP,UDP,TCP报头部分都有checksum(检验和)字段.IP 首部里的校验和只校验首部:ICMP.IGMP.TCP和UDP首部中的校验和校验首部和数据. UDP和TCP ...
- 【iCore3 双核心板】例程三十三:SD_IAP_ARM实验——更新升级STM32
实验指导书及代码包下载: http://pan.baidu.com/s/1jHmvQfk iCore3 购买链接: https://item.taobao.com/item.htm?id=524229 ...
- java环境搭建系列:JDK环境变量详细配置
学习java语言,编写java程序,运行java程序,都离不开Java环境的支持,最重要的就是安装JDK,JDK给我提供了java程序的开发环境和运行环境.为了让java程序放在电脑的任意位置都可以执 ...
- windows查看端口命令
netstat -ano 查看所有端口 netstat -ano|findstr "1935" 查看1935端口占用PID tasklist|findstr "PID”
- Trace文件过量生成问题解决
查看用户临时文件(trace文件)所在位置 如果是trace文件(.trc)大导致的 SQL>show parameters user_dump_dest 在路径下查看 alert_log 文件 ...
- meanshift
http://blog.jasonding.top/2014/10/14/Machine%20Learning/%E3%80%90%E8%AE%A1%E7%AE%97%E6%9C%BA%E8%A7%8 ...
- openstack搭建配置
安装和配置网络节点vim /etc/sysctl.confnet.ipv4.ip_forward=1net.ipv4.conf.all.rp_filter=0net.ipv4.conf.default ...
- node + nginx + mongo搭建负载均衡
基于node和nignx和mongo搭建负载均衡 nginx配置: upstream back { # ...