十三、$.ajax、模态/非模态框、window.open()、href属性、submit()等提交请求及优劣及问题解决
2021-03-22 21:27
标签:解决 utf-8 script styles 上层 居中 字符串类型 div coder 1. $.ajax提交请求进行数据更新,并通过回调进行有效提示 $.ajax({})优劣: 模态/非模态框语法: 模态/非模态框优劣: 3、window.open()提交请求并新打开一个标签页 window.open()语法: window.open()优劣: 4、href属性 herf属性优劣 优势:灵活,页面中的链接跳转通常采用此种方法 5、通过Form对象的submit()提交 6、jquery-form.js中的ajaxSubmit() 优势:提交请求时,可以是实现回调,进而判断该请求是处理成功还是处理失败了 以上均是自己的均是自己的理解,可能有不准确的地方,如若发现请网友评论指出,谢谢! 十三、$.ajax、模态/非模态框、window.open()、href属性、submit()等提交请求及优劣及问题解决 标签:解决 utf-8 script styles 上层 居中 字符串类型 div coder 原文地址:https://www.cnblogs.com/jiarui-zjb/p/9477498.html$.ajax({
type: "post",
url: dispacher,
data: {"insurCode" : tmp,
"currentPage" : currentpage,
"pageDirection" : ‘current‘
},
success: function(data) {
if(data == ‘OK‘ && dispacher==‘auditAction.do?action=updateById‘){
alert( ‘审核成功!点击确定刷新列表‘);
seachHeadPage(‘‘);//重新进行查询更新查询列表数据显示
}else{
alert(‘审核失败,请稍后再试!‘);
}
},
error: function(data) {
alert("系统错误,请稍后再试!");
}
})
更新数据后的JAVA回写代码
boolean boo= auditService.updateAuditById(insurCode);
if(boo){
response.getWriter().write("OK");
}else{
response.getWriter().write("NO");
}
response.getWriter().flush();
response.getWriter().close();
优势:提交请求时,可以是实现回调,进而判断该请求是处理成功还是处理失败了
劣势:不支持流文件的回调。例如当你对生成的excle文件进行下载是使用$.ajax({})是无法实现的,除非...使用组合,将在该文的最后进行列举说明
2、模态提交请求弹出新窗口,且该窗口不关闭是无法对父页面/其他页进行操作操作1:父页面代码:
//通过模态框提交请求的代码:
var dispacher==‘auditAction.do?action=updateById‘;
var temp = window.showModalDialog(
dispacher + "&insurCode=" + tmp + "¤tPage=" + currentpage +"&pageDirection=current",
window,
‘dialogHeight=750px;dialogWidth=1000px;dialogRight=40px;dialogTop=30px;center:yes‘);
//子页面保存操作成功后刷新该页面的查询列表
if (temp == ‘saveSuccess‘&& dispacher==‘auditAction.do?action=updateById‘) {
seachHeadPage(‘‘);
}
操作2:
在弹出子页面中点击【保存】按钮,数据保存成功,并向父页面传递子页面数据保存成功标识‘saveSuccess‘
var isFinished = "
1)window.showModalDialog()方法用来创建一个显示HTML内容的模态对话框。
2)window.showModelessDialog()方法用来创建一个显示HTML内容的非模态对话框。
使用方法:
vReturnValue = window.showModalDialog(sURL [, vArguments] [,sFeatures])
vReturnValue = window.showModelessDialog(sURL [, vArguments] [,sFeatures])
参数说明:
要想对话框传递参数,是通过vArguments来进行传递的。类型不限制,对于字符串类型,最大为4096个字符。也可以传递对象,
sURL--必选参数,类型:字符串。用来指定对话框要显示的文档的URL。
vArguments--可选参数,类型:变体。用来向对话框传递参数。传递的参数类型不限,包括数组等。对话框通过window.dialogArguments来取得传递进来的参数。
sFeatures-- 可选参数,类型:字符串。用来描述对话框的外观等信息,可以使用以下的一个或几个,用分号“;”隔开。
a、dialogHeight :对话框高度,不小于100px,IE4中dialogHeight 和 dialogWidth 默认的单位是em,而IE5以上是px,为方便其见,在定义modal方式的对话框时,用px做单位。
b、dialogWidth: 对话框宽度。
c、dialogLeft: 离屏幕左的距离。
d、dialogTop: 离屏幕上的距离。
e、center: {yes | no | 1 | 0 }:窗口是否居中,默认yes,但仍可以指定高度和宽度。
f、help: {yes | no | 1 | 0 }:是否显示帮助按钮,默认yes。
g、resizable: {yes | no | 1 | 0 } 〔IE5+〕:是否可被改变大小。默认no。
h、status: {yes | no | 1 | 0 } 〔IE5+〕:是否显示状态栏。默认为yes[ Modeless]或no[Modal]。
i、scroll:{ yes | no | 1 | 0 | on | off }:指明对话框是否显示滚动条。默认为yes。
下面几个属性是用在HTA中的,在一般的网页中一般不使用。
10.dialogHide:{ yes | no | 1 | 0 | on | off }:在打印或者打印预览时对话框是否隐藏。默认为no。
11.edge:{ sunken | raised }:指明对话框的边框样式。默认为raised。
12.unadorned:{ yes | no | 1 | 0 | on | off }:默认为no。
优势:可灵活的对弹框进行设置(大小、是否居中、滚动条)等,且能够传递参数给父页面,非常实用。
功能上的缺点暂时没有发现,书写上有点繁杂。function searchAuditNew(dispacher) {
window.open(
dispacher,
‘‘,
‘height=630,width=810,top=‘
+ (screen.height - 630)
/ 2
+ ‘,left=‘
+ (screen.width - 810)
/ 2
+ ‘,toolbar=no,menubar=no,scrollbars=yes,resizable=no,location=no,status=no,center=yes‘
);
}
window对象的open()方法:用于打开一个新的浏览器窗口或查找一个已命名的窗口
用法1):
window.open("http://www.baidu.com","_blank");
//默认就是开启一个新窗口,老窗口称为父窗口,新窗口称为子窗口
参数取值:
_blank -- 打开一个新窗体
_parent -- 在父窗体中打开
_self -- 在本页打开,此为默认值
_top -- 在上层窗体中打开
_search --同时打开搜索窗口
用法2):
window.open(URL,name,features,replace)
参数取值:
a、URL:一个可选的字符串
声明了要在新窗口中显示的文档的 URL。如果省略了这个参数,或者它的值是空字符串,那么新窗口就不会显示任何文档。
b、NAME:一个可选的字符串
该字符串是一个由逗号分隔的特征列表,其中包括数字、字母和下划线,该字符声明了新窗口的名称。
这个名称可以用作标记 和
优势:是window本身具有的方法,兼容性强,父子之间数值传递操作容易实现(待补充)
缺点:无法实现子页面不关闭就无法对父页面操作这样的功能1)作为LINK标签的属性,指向所引用文件的URL地址
2)base标签为页面上的所有链接规定默认地址或默认目标。
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
劣势:当传递的参数较多时,代码显得不美观,且其提交参数方式为浏览器默认的方式(get请求),存在中文时会出现乱码问题,需要特殊处理window.location.href=dispatcher+"&custName="+encodeURI(custname)+"&isNormal="+encodeURI(isNormal);java.net.URLDecoder.decode(custname, "utf-8").trim();//属于rt.jar包中类var frm=document.forms(‘tranDataFrom‘);
frm.action=‘hisAction.do?action=doSearch&pageDir=‘+pageDir;
frm.submit();
优劣:方便,无法实现实现回调;
"/>
var isNormal="notNormal";//导出数是否超范围标识
$(function(){
$("#inputFrom").ajaxSubmit(function(data){
if(data=="exportHuge"){
alert("查询结果数据量偏大,请缩小查询范围!");
}else if(data=="normal"){
isNormal="normal";
$("#isNormal").val(isNormal);
document.getEleById("inputFrom").submit();
}
});
});
更新数据后的JAVA回写代码
if(auditList.size()>=65536&&"notNormal".equals(isNormal)){
response.getWriter().write("exportHuge");
response.getWriter().close();
return null;
}else if("notNormal".equals(isNormal)&&auditList.size()){
response.getWriter().write("normal");
response.getWriter().close();
return null;
}else if ("normal".equals(isNormal)) {
System.out.println("开始导出excle操作");
}
劣势:不支持流文件的回调。但是可以通过组合触发请求的方式来实现
文章标题:十三、$.ajax、模态/非模态框、window.open()、href属性、submit()等提交请求及优劣及问题解决
文章链接:http://soscw.com/index.php/essay/67679.html