jquery无刷新上传
㈠ Jquery怎么样实按钮不回传，无刷新技术
通过 HTTP 请求加载远程数据。
jQuery 底层 AJAX 实现。简单易用的高层实现见 $.get, $.post 等。$.ajax() 返回其创建的 XMLHttpRequest 对象。大多数情况下你无需直接操作该对象，但特殊情况下可用于手动终止请求。
$.ajax() 只有一个参数：参数 key/value 对象，包含各配置及回调函数信息。详细参数选项见下。
注意： 如果你指定了 dataType 选项，请确保服务器返回正确的 MIME 信息，(如 xml 返回 "text/xml")。错误的 MIME 类型可能导致不可预知的错误。见 Specifying the Data Type for AJAX Requests 。
注意：如果dataType设置为"script"，那么在远程请求时(不在同一个域下)，所有POST请求都将转为GET请求。(因为将使用DOM的script标签来加载)
jQuery 1.2 中，您可以跨域加载 JSON 数据，使用时需将数据类型设置为 JSONP。使用 JSONP 形式调用函数时，如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名，以执行回调函数。数据类型设置为 "jsonp" 时，jQuery 将自动调用回调函数。
参数
options (可选)ObjectAJAX 请求设置。所有选项都是可选的。
选项
asyncBoolean(默认: true) 默认设置下，所有请求均为异步请求。如果需要发送同步请求，请将此选项设置为 false。注意，同步请求将锁住浏览器，用户其它操作必须等待请求完成才可以执行。
beforeSendFunction发送请求前可修改 XMLHttpRequest 对象的函数，如添加自定义 HTTP 头。XMLHttpRequest 对象是唯一的参数。这是一个 Ajax 事件。如果返回false可以取消本次ajax请求。
function (XMLHttpRequest) {
this; // 调用本次AJAX请求时传递的options参数
}
cacheBoolean(默认: true,dataType为script时默认为false) jQuery 1.2 新功能，设置为 false 将不会从浏览器缓存中加载请求信息。
completeFunction请求完成后回调函数 (请求成功或失败时均调用)。参数： XMLHttpRequest 对象和一个描述成功请求类型的字符串。 Ajax 事件。
function (XMLHttpRequest, textStatus) {
this; // 调用本次AJAX请求时传递的options参数
}
contentTypeString(默认: "application/x-www-form-urlencoded") 发送信息至服务器时内容编码类型。默认值适合大多数应用场合。
dataObject,String发送到服务器的数据。将自动转换为请求字符串格式。GET 请求中将附加在 URL 后。查看 processData 选项说明以禁止此自动转换。必须为 Key/Value 格式。如果为数组，jQuery 将自动为不同值对应同一个名称。如 {foo:["bar1", "bar2"]} 转换为 '&foo=bar1&foo=bar2'。
dataFilterFunction给Ajax返回的原始数据的进行预处理的函数。提供data和type两个参数：data是Ajax返回的原始数据，type是调用jQuery.ajax时提供的dataType参数。函数返回的值将由jQuery进一步处理。
function (data, type) {
// 对Ajax返回的原始数据进行预处理
return data // 返回处理后的数据
}
dataTypeString
预期服务器返回的数据类型。如果不指定，jQuery 将自动根据 HTTP 包 MIME 信息返回 responseXML 或 responseText，并作为回调函数参数传递，可用值:
"xml": 返回 XML 文档，可用 jQuery 处理。
"html": 返回纯文本 HTML 信息；包含的script标签会在插入dom时执行。
"script": 返回纯文本 javaScript 代码。不会自动缓存结果。除非设置了"cache"参数。'''注意：'''在远程请求时(不在同一个域下)，所有POST请求都将转为GET请求。(因为将使用DOM的script标签来加载)
"json": 返回 JSON 数据 。
"jsonp": JSONP 格式。使用 JSONP 形式调用函数时，如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名，以执行回调函数。
"text": 返回纯文本字符串
errorFunction(默认: 自动判断 (xml 或 html)) 请求失败时调用时间。参数有以下三个：XMLHttpRequest 对象、错误信息、（可选）捕获的错误对象。如果发生了错误，错误信息（第二个参数）除了得到null之外，还可能是"timeout", "error", "notmodified" 和 "parsererror"。Ajax 事件。
function (XMLHttpRequest, textStatus, errorThrown) {
// 通常 textStatus 和 errorThrown 之中
// 只有一个会包含信息
this; // 调用本次AJAX请求时传递的options参数
}
globalBoolean(默认: true) 是否触发全局 AJAX 事件。设置为 false 将不会触发全局 AJAX 事件，如 ajaxStart 或 ajaxStop 可用于控制不同的 Ajax 事件。
ifModifiedBoolean(默认: false) 仅在服务器数据改变时获取新数据。使用 HTTP 包 Last-Modified 头信息判断。
jsonpString在一个jsonp请求中重写回调函数的名字。这个值用来替代在"callback=?"这种GET或POST请求中URL参数里的"callback"部分，比如{jsonp:'onJsonPLoad'}会导致将"onJsonPLoad=?"传给服务器。
passwordString用于响应HTTP访问认证请求的密码
processDataBoolean(默认: true) 默认情况下，发送的数据将被转换为对象(技术上讲并非字符串) 以配合默认内容类型 "application/x-www-form-urlencoded"。如果要发送 DOM 树信息或其它不希望转换的信息，请设置为 false。
scriptCharsetString只有当请求时dataType为"jsonp"或"script"，并且type是"GET"才会用于强制修改charset。通常在本地和远程的内容编码不同时使用。
successFunction请求成功后的回调函数。参数：由服务器返回，并根据dataType参数进行处理后的数据；描述状态的字符串。 Ajax 事件。
function (data, textStatus) {
// data 可能是 xmlDoc, jsonObj, html, text, 等等...
this; // 调用本次AJAX请求时传递的options参数
}
timeoutNumber设置请求超时时间（毫秒）。此设置将覆盖全局设置。
typeString(默认: "GET") 请求方式 ("POST" 或 "GET")， 默认为 "GET"。注意：其它 HTTP 请求方法，如 PUT 和 DELETE 也可以使用，但仅部分浏览器支持。
urlString(默认: 当前页地址) 发送请求的地址。
usernameString用于响应HTTP访问认证请求的用户名
xhrFunction需要返回一个XMLHttpRequest 对象。默认在IE下是ActiveXObject 而其他情况下是XMLHttpRequest 。用于重写或者提供一个增强的XMLHttpRequest 对象。这个参数在jQuery 1.3以前不可用。
示例
描述:
加载并执行一个 JS 文件。
jQuery 代码:
$.ajax({
type: "GET",
url: "test.js",
dataType: "script"
});描述:
保存数据到服务器，成功时显示信息。
jQuery 代码:
$.ajax({
type: "POST",
url: "some.php",
data: "name=John&location=Boston",
success: function(msg){
alert( "Data Saved: " + msg );
}
});描述:
装入一个 HTML 网页最新版本。
jQuery 代码:
$.ajax({
url: "test.html",
cache: false,
success: function(html){
$("#results").append(html);
}
});描述:
同步加载数据。发送请求时锁住浏览器。需要锁定用户交互操作时使用同步方式。
jQuery 代码:
var html = $.ajax({
url: "some.php",
async: false
}).responseText;描述:
发送 XML 数据至服务器。设置 processData 选项为 false，防止自动转换数据格式。
jQuery 代码:
var xmlDocument = [create xml document];
$.ajax({
url: "page.php",
processData: false,
data: xmlDocument,
success: handleResponse
});
㈡ jquery的post方法上传文件问题。
用AJAXForm插件来完成，当然还有很多的jquery插件可以完成无刷新上传，甚至是多文件无刷新同时上传
㈢ jquery页面无刷新怎么做才能提交数据给其它地方
Struts2 传输数据到Ext
浏览次数：30次 悬赏分：0 | 解决时间：2011-8-2 16:50 | 提问者：wfpxl
最近在做一个小web系统 遇到一点问题，向大家求助：
web 首页 是一个jsp页面 有一个输入框 可以输入要查询的关键字，当输入完之后后台action查询完数据库会返回一个list 这时我想把这个list 在页面上用 ext grid的展示 请问应该怎样自动把数据传输到我希望显示的页面上 也就是说 同时满足json格式 也满足跳转页面。
以前用struts 处理页面时 <result name="success">/XXX.jsp</result>可以控制跳转的页面 但是无法控制传输的时json格式 现在如果这么写<result type="json"></result>就不能指定跳转的页面 所以请各位大侠解答一下 怎样才能既保证跳转格式又保证传到前台的时json数据 同时前台应该怎样自动获得json数据 谢谢啦~
最佳答案
后台：request.setAttribute("LIST",your_list);
前台：$.ajax({
cache:false,
type:"POST",
url:"你后台action的路径",
success：function（data）{//data用来接收你的list，此时接收过来的数据格式并不是list需转化
var x=eval("("+data+")");//转换data格式，此时的x 就是list了
接下来遍历，你想怎么处理就怎么处理了.....
}
});
㈣ JQUERY关于无刷新页面
那就用ajax来请求后台数据，然后再把得到的数据在前端显示：
$.ajax({
type:"POST",
url:"some.php",
data:"name=John&location=Boston",
success:function(msg){
alert("DataSaved:"+msg);
}
});在success中处理返回的数据。
㈤ jquery 多个 上传文件教程
jquery 实现多个上传文件教程：
首先创建解决方案,添加jquery的js和一些资源文件(如图片和进度条显示等):
jquery-1.3.2.min.js
jquery.uploadify.v2.1.0.js
jquery.uploadify.v2.1.0.min.js
swfobject.js
uploadify.css
1、页面的基本代码如下
这里用的是aspx页面(html也是也可的)
页面中引入的js和js函数如下：
<scriptsrc="js/jquery-1.3.2.min.js"type="text/javascript"></script>
<scriptsrc="js/jquery.uploadify.v2.1.0.js"type="text/javascript"></script>
<scriptsrc="js/jquery.uploadify.v2.1.0.min.js"type="text/javascript"></script>
<scriptsrc="js/swfobject.js"type="text/javascript"></script>
<linkhref="css/uploadify.css"rel="stylesheet"type="text/css"/>
</script>
js函数：
<scripttype="text/javascript">
$(document).ready(function(){
$("#uploadify").uploadify({
'uploader':'image/uploadify.swf',//uploadify.swf文件的相对路径，该swf文件是一个带有文字BROWSE的按钮，点击后淡出打开文件对话框
'script':'Handler1.ashx',//script：后台处理程序的相对路径
'cancelImg':'image/cancel.png',
'buttenText':'请选择文件',//浏览按钮的文本，默认值：BROWSE。
'sizeLimit':999999999,//文件大小显示
'floder':'Uploader',//上传文件存放的目录
'queueID':'fileQueue',//文件队列的ID，该ID与存放文件队列的div的ID一致
'queueSizeLimit':120,//上传文件个数限制
'progressData':'speed',//上传速度显示
'auto':false,//是否自动上传
'multi':true,//是否多文件上传
//'onSelect':function(e,queueId,fileObj){
//alert("唯一标识:"+queueId+" "+
//"文件名："+fileObj.name+" "+
//"文件大小："+fileObj.size+" "+
//"创建时间："+fileObj.creationDate+" "+
//"最后修改时间："+fileObj.modificationDate+" "+
//"文件类型："+fileObj.type);
//}
'onQueueComplete':function(queueData){
alert("文件上传成功！");
return;
}
});
});
页面中的控件代码：
<body>
<formid="form1"runat="server">
<divid="fileQueue">
</div>
<div>
<p>
<inputtype="file"name="uploadify"id="uploadify"/>
<inputid="Button1"type="button"value="上传"onclick="javascript:$('#uploadify').uploadifyUpload()"/>
<inputid="Button2"type="button"value="取消"onclick="javascript:$('#uploadify').uploadifyClearQueue()"/>
</p>
</div>
</form>
</body>
函数主要参数：
$(document).ready(function(){
$('#fileInput1').fileUpload({
'uploader':'uploader.swf',//不多讲了
'script':'/AjaxByJQuery/file.do',//处理Action
'cancelImg':'cancel.png',
'folder':'',//服务端默认保存路径
'scriptData':{'methed':'uploadFile','arg1','value1'},
//向后台传递参数,methed,arg1为参数名,uploadFile,value1为对应的参数值,服务端通过request["arg1"]
'buttonText':'UpLoadFile',//按钮显示文字,不支持中文,解决方案见下
//'buttonImg':'图片路径',//通过设置背景图片解决中文问题,就是把背景图做成按钮的样子
'multi':'true',//多文件上传开关
'fileExt':'*.xls;*.csv',//文件过滤器
'fileDesc':'.xls',//文件过滤器详解见文档
'onComplete':function(event,queueID,file,serverData,data){
//serverData为服务器端返回的字符串值
alert(serverData);
}
});
});后台一般处理文件：
usingSystem;
usingSystem.Collections.Generic;
usingSystem.Linq;
usingSystem.IO;
usingSystem.Net;
usingSystem.Web;
usingSystem.Web.Services;
namespacefupload
{
///<summary>
///Handler1的摘要说明
///</summary>
publicclassHandler1:IHttpHandler
{
publicvoidProcessRequest(HttpContextcontext)
{
context.Response.ContentType="text/plain";
HttpPostedFilefile=context.Request.Files["Filedata"];//对客户端文件的访问
stringuploadPath=HttpContext.Current.Server.MapPath(@context.Request["folder"])+"\";//服务器端文件保存路径
if(file!=null)
{
if(!Directory.Exists(uploadPath))
{
Directory.CreateDirectory(uploadPath);//创建服务端文件夹
}
file.SaveAs(uploadPath+file.FileName);//保存文件
context.Response.Write("上传成功");
}
else
{
context.Response.Write("0");
}
}
publicboolIsReusable
{
get
{
returnfalse;
}
}
}
}
以上方式基本可以实现多文件的上传，大文件大小是在控制在10M以下/。
㈥ 关于jquery ajax 无刷新提交的问题
点击确定按钮事件
button.live(function() {
$.ajax({
url: "UpdateCount.do", //请求地址 ，自己写，我这里是struts
type: "post", // 请求方式 post和get两种
data: "count=" + 修改的值 //count是你发送的参数
dataType: "text",
success:function(){}
error:function(){}
});
});
你也可以查查jquery $.ajax用法，网上很多
㈦ jQuery无刷新传入DataList数据源
我这里有一个 三联下拉列表的例子 就是 无刷新更新数据的
我给你提供一个三级的
主页面是
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>三级联动下拉列表</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="/js/jquery.js"></script>
<script type="text/javascript">
<!--
var temp;
var ids = ['province','city','eare1']; //默认要操作的三个ID，注意先后顺序，不可颠倒。
// 参数说明:pid是关联 的id (第二个参数) 的父级,n表示是第几级,(如第一级，第二级，第三级),selected 默认被选中的选择的主键
function getList (pid,id,n,selected) {
var list = document.getElementById(id);
//$.post 会通过POST传递2个值
//pid和action由于有？存在又传递了一个act
$.post ('ajax.php?act=getList',{'pid':pid,'action':id},function (data) {
var temp1 = eval('('+ data +')'); //把传过来的字符串转化成一个JSON对象。
var leng = temp1.length;
var n = (n > ids.length ) ? ids.length : n;
n = (n < 0 ) ? 0 : n;
for (var j = n ; j < ids.length ; j++)
{
var t = 'temp'+j
t = document.getElementById(ids[j]);
t.options.length = 1;
t.options[0]=new Option('请选择','*');
}
if (leng > 0) {
list.length = leng + 1;
for (var i=0;i < temp1.length ;i++ )
{
list.options[i+1]=new Option(decodeURI(temp1[i].key),temp1[i].val);
if (temp1[i].region_id == selected ) {
list.options[0].selected = 'selected';
}
if (selected&&list.options[i+1].value==selected){
list.options[i+1].selected = 'selected';
}
}
}
if(pid == '*') {
switch(id){
case 'city':
t = document.getElementById('city');
t.options.length = 1;
t.options[0]=new Option('请选择','*');
t = document.getElementById('eare1');
t.options.length = 1;
t.options[0]=new Option('请选择','*');
break;
case 'eare1':
t = document.getElementById('eare1');
t.options.length = 1;
t.options[0]=new Option('请选择','*');
break;
}
}
if(document.getElementById('city')&&document.getElementById('city').value=='*'){
t = document.getElementById('eare1');
t.options.length = 1;
t.options[0]=new Option('请选择','*');
}
});
}
$(function () {
getList ('1','province',1);
//三个都写是为了修改的时候，请三个框中默认的都有选中的值,一般增加的时候只写第一个就可以了。
});
</script>
</head>
<body>
<div >
<select name="yc1" id="province" onchange="getList (this.value,'city',1)">
<option value="*" selected="selected">请选择</option>
</select>
<select name="yc2" id="city" onchange="getList (this.value,'eare1',2)">
<option value="*" selected="selected">请选择</option>
</select>
<select name="yc3" id="eare1">
<option value="*" selected="selected">请选择</option>
</select>
</div>
</body>
</html>
AJAX 页面是
<?php
$link = mysql_connect("localhost", "root", "123456");
mysql_select_db("mydatabase");
//接收$.post传递的值并通过值对数据库进行操作
$act = isset ($_GET['act']) ? $_GET['act'] : '' ;
$action = isset ($_POST['action']) ? $_POST['action'] : '' ;
$pid = isset ($_POST['pid']) ? $_POST['pid'] : '' ;
$arr = array();
switch ($action) {
case 'province':
$sql = "select DISTINCT(province_name) val,province_id key from province order by id";
$res = mysql_query($sql);
while($col = mysql_fetch_array($res)){
$arr[] = $col;
}
break;
case 'city':
$sql = "select DISTINCT(city_name) val,city_id key from city where `province_id` = '".$pid."'
order by id";
$res = mysql_query($sql);
while($col = mysql_fetch_array($res)){
$arr[] = $col;
}
break;
case 'eare1':
$sql = "select DISTINCT(eare1_name) val,eare1_id key from eare1 where `city_id` = '".$pid."'
order by id";
$res = mysql_query($sql);
while($col = mysql_fetch_array($res)){
$arr[] = $col;
}
break;
}
mysql_close($link);
$list = array();
$i = 0;
foreach($arr as $k => $v){
foreach($v as $key => $value){
if(!preg_match("|^\d+|",$key)){
$list[$i][$key] = $value;
}
}
$i++;
}
//把格式化的数据通过json_encode和print_r返回
print_r (json_encode ($list));
数据库关联是
表province 区域表
有ID province_id province_name三个字段
id是自增的 province_id为唯一
表CITY 城市表
有ID city_id city_name province_id
其中province_id与province表的province_id对应
id是自增的 city_id为唯一
最后一个表类似与city表
jquery.js可以到http://jquery.com/下载
如果有问题可以在晚上7-10点 在H!给我留言
㈧ 使用jquery的ajaxfileupload.js和struts2无刷新上传文件出错
getXXX方法是从session中取参数值，从你贴出的代码来看 没有涉及到这块，所以我觉得你要是用System.out.println("userIcon:" + getId_userIcon()); 取不到任何id·
个人浅见~