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·
個人淺見~