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封装的最基础步,通过使用这个函数可以完成异 ...
随机推荐
- Web前端代码页面布局总结
一. html (1)编码:所有编码均采用xhtml,标签必须闭合,属性值用双引号包括,编码统一为utf-8. (2)语义化:语义化html,正确使用标签. (3)文件命名:命名以中文命名,依实际模 ...
- Oracle手工建库
环境准备 手工建库的前提是ORACLE软件已经正确安装到操作系统中,只是需要我们利用ORACLE软件提供的一些工具和脚本来创建一个数据库,创建这个数据库可以运行DBCA工具图形化创建,也可以使用CRE ...
- 让你的网站秒开 为IIS启用“内容过期”
让你的网站秒开,为IIS启用“内容过期” 什么是内容过期? 当用户第一次访问你的网站,浏览器从你的网站主机下载内容,如果用户第二次访问你的网站,浏览器从缓存读取内容.你知道浏览器从缓存读取网页有多快吗 ...
- Trie树
一.什么是trie树 1.Trie树 (特例结构树) Trie树,又称单词查找树.字典树,是一种树形结构,是一种哈希树的变种,是一种用于快速检索的多叉树结构.典型应用是用于统计和排序大量的字符串( ...
- 【iCore3 双核心板】例程十三:SDIO实验——读取SD卡信息
实验指导书及代码包下载: http://pan.baidu.com/s/1hqM787E iCore3 购买链接: https://item.taobao.com/item.htm?id=524229 ...
- apk反编译、smali修改、回编译笔记
最近下了一个apk程序,但是一启动会弹出一个流氓广告.这个广告不是原厂商加的,而是有人在原有apk程序的基础上,加了一个壳,让apk先启动他加的广告,再启动原来的程序,很恶心.于是想去掉它. 试了几个 ...
- JavaScript 字符 "转换
后台把一个Json类型的数据当成字符串返回到前台,但是到前台变成了下面的这个样子 "[{"name":"IE","y":72},{ ...
- 【C51】74HC573芯片
74HC573是一个8位3态带锁存高速的逻辑芯片.下面介绍使用. 参数(仅供参考) Vcc 2~6V I in +-20mA I out +- 35mA 引脚图和引脚作用 ...
- java中遍历集合的三种方式
第一种遍历集合的方式:将集合变为数组 package com.lw.List; import java.util.ArrayList; import java.util.List; import ja ...
- dom4j微信接口开发
新建一个web项目,我用的是eclipse和tomcat7.0 ,外网环境用的nat123 先建立一个实体bean:TextMessage /** * xml基本对象 * @author xiaohu ...