jquery ajax调用webservice(C#)要注意的几个事项:

[复制链接]
查看11 | 回复6 | 2005-10-30 17:05:33 | 显示全部楼层 |阅读模式
Jquery ajax调用webservice总结
jquery ajax调用webservice(C#)要注意的几个事项:1、web.config里需要配置2个地方



在之间加入




2.正确地编写webserivce的代码
[url=][/url]
///
/// UserValidate 的摘要说明
///
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.ComponentModel.ToolboxItem(false)]
// 若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务,请取消对下行的注释。
[System.Web.Script.Services.ScriptService]
public class UserValidate : System.Web.Services.WebService
{
DFHon.Content.Common.rootPublic rp = new DFHon.Content.Common.rootPublic();
[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public string ValidateUserLogState()
{

string result = "";

HttpCookie cookie = HttpContext.Current.Request.Cookies["DHFonMenberInfo"];

if (cookie != null)

{

string username = System.Web.HttpUtility.UrlDecode(cookie["MenberName"]);

int ipoint = 0;

int gpoint = 0;

try

{

DataTable dt = UserBll.ExecuteUserAllInfo(username);

if (dt.Rows.Count > 0)

{

ipoint = int.Parse(dt.Rows[0]["iPoint"].ToString());

gpoint = int.Parse(dt.Rows[0]["gPoint"].ToString());

}

}

catch

{ }

result = "{'user':{'id':'" + cookie["UserId"] + "','name':'" + username + "','message':'" + rp.getUserMsg(DFHon.Global.CurrentCookie.UserName) + "','ipoint':'" + ipoint.ToString() + "','gpoint':'" + gpoint.ToString() + "'}}";

}

else

{

result = "{'user':{'id':'0','name':'','message':'0','ipoint':'0','gpoint':'0'}}";

}

return result;
}
[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public string UserLogin(string userName, string userPwd)
{

string returnVal = "";

try

{

GlobalUserInfo info;

DFHon.Content.UserLogin _UserLogin = new DFHon.Content.UserLogin();

EnumLoginState state = _UserLogin.PersonLogin(HttpUtility.UrlDecode(userName), userPwd, out info);

if (state == EnumLoginState.Succeed)

{

DFHon.Global.CurrentCookie.Set(info);

DFHon.API.PDO.DiscuzNT.PassportLogin.UserLogin(Server.UrlDecode(userName), userPwd, -1);

int ipoint = 0;

int gpoint = 0;

DataTable dt = UserBll.ExecuteUserAllInfo(userName);

if (dt.Rows.Count > 0)

{

ipoint = int.Parse(dt.Rows[0]["iPoint"].ToString());

gpoint = int.Parse(dt.Rows[0]["gPoint"].ToString());

}

returnVal = "{'user':{'id':'" + info.UserId.ToString() + "','name':'" + info.UserName + "','message':'" + rp.getUserMsg(userName) + "','ipoint':'" + ipoint.ToString() + "','gpoint':'" + gpoint.ToString() + "'}}";

}

else

{

int ids = 0;//状态:-2用户被锁定 -1用户名密码错误

switch (state)

{

case EnumLoginState.Err_Locked:

ids = -2;

break;

case EnumLoginState.Err_UserNameOrPwdError:

ids = -1;

break;

default:

break;

}

returnVal = "{'user':{'id':'" + ids + "','name':'','message':'0','ipoint':'0','gpoint':'0'}}";

}

}

catch

{

returnVal = "{'user':{'id':'0','name':'','message':'0','ipoint':'0','gpoint':'0'}}";

}

return returnVal;
}
[WebMethod]
public string UserLogout()
{

if (HttpContext.Current.Request.Cookies["DHFonMenberInfo"] != null)

{

HttpCookie cookie = new HttpCookie("DHFonMenberInfo");

cookie.Expires = System.DateTime.Now.AddDays(-1);

cookie.Domain = DFHon.Config.BaseConfig.getV("weblogin");

HttpContext.Current.Response.AppendCookie(cookie);

}

return "1";
}
DFHon.Content.user UserBll = new DFHon.Content.user();
[WebMethod]
public string ValidateUserEmail(string email)
{

string result = "0";//返回的结果 -2邮箱为空 -1邮箱格式不正确 0邮箱存在 1填写正确

if (string.IsNullOrEmpty(email))

{

result = "-2";//邮箱为空

}

else if (!IsValidEmail(email))

{

result = "-1";//邮箱格式不正确

}

else if (UserBll.sel_useremail(email) > 0)

{

result = "0";//邮箱存在

}

else

{

result = "1";//可以注册

}

return result;
}
[WebMethod]
public string ValidateUserName(string username)
{

string result = "0";//返回值:-1用户名长度为2-16;0用户名存在;1可以注册

if (username == "" || username == null || username.Length16)

{

result = "-1";

}

else if (UserBll.sel_username(username) != 0)

{

result = "0";

}

else

{

result = "1";

}

return result;
}
public bool IsValidEmail(string strIn)
{ // Return true if strIn is in valid e-mail format.

return System.Text.RegularExpressions.Regex.IsMatch(strIn, @"^([\w-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([\w-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$");
}
}[url=][/url]
3、前台JQuery代码
[url=][/url]
http://www.cnblogs.com/andiki/archive/2010/05/17/1737254.html


回复

使用道具 举报

千问 | 2005-10-30 17:05:33 | 显示全部楼层
jQuery AJAX 请求,后台收到为乱码
可以显式设置contentType的编码为utf-8, 后台一般都能正常解码例如:
[javascript] view plaincopy
contentType: "application/x-www-form-urlencoded; charset=utf-8",

[javascript] view plaincopy
jQuery(form).ajaxSubmit({
url: "doLogin?user=a",
type: "post",
dataType: "json",
contentType: "application/x-www-form-urlencoded; charset=utf-8",
success: showLoginResponse
});
如果不加contentType: "application/x-www-form-urlencoded; charset=UTF-8",而使用escape(),则会出现
post 主体包含的字节比内容长度指定的字节要少
的错误.

2.jQuery AJAX 返回乱码
你是否发现无论你怎么设置编码, 客户端收到的数据总是乱码呢, 请看下面的例子,你发现有什么问题吗?
[java] view plaincopy
void saveTempKind(HttpServletRequest req, HttpServletResponse resp)

throws ServletException, IOException {
PrintWriter pw = resp.getWriter();
resp.setContentType("text/text;charset=GBK");
try {
//DO PROCESS
pw.write("成功");
}catch(Exception e){
pw.write("失败");
}
}
问题在于resp.setContentType("text/text;charset=GBK"); 语句应该在
[javascript] view plaincopy
PrintWriter pw = resp.getWriter();
之前,而不是之后。如果象上例这样,无论你怎么设置response的编码,前端乱码的问题都依然如故。 可能的原因是pw在获得PriintWriter 之前,编码就已经确定了。所以编码的声明应该在获取PrintWriter对象之前http://blog.csdn.net/hongweigg/article/details/6756278
eb.Script.Serialization.JavaScriptSerializer.Deserialize(JavaScriptSerializer serializer, String input, Type type, Int32 depthLimit)\r\n 在 System.Web.Script.Serialization.JavaScriptSerializer.Deserialize[T](String input)\r\n 在 System.Web.Script.Services.RestHandler.GetRawParamsFromPostRequest(HttpContext context, JavaScriptSerializer serializer)\r\n 在 System.Web.Script.Services.RestHandler.GetRawParams(WebServiceMethodData methodData, HttpContext context)\r\n 在 System.Web.Script.Services.RestHandler.ExecuteWebServiceCall(HttpContext context, WebServiceMethodData methodData)","ExceptionType":"System.ArgumentException"}
我服务端

namespace ApplicationModuleDemo.Service
{
///
/// test 的摘要说明
///
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.ComponentModel.ToolboxItem(false)]
// 若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务,请取消对下行的注释。
[System.Web.Script.Services.ScriptService]
public class test : System.Web.Services.WebService
{
[WebMethod]
public IList GetList(int id)
{

IList list = new OrganizationInstitutionComments().GetBySQL("[institutionId]=" + id + " and [passed]=1");

foreach (OrganizationInstitutionCommentsInfo model in list)

{

model.UserPhoto = model.UserPhoto.Replace("./", AppConfig.API_SERVER + "/");

model.UserUrl = AppConfig.API_SERVER + "/BlogManage/UserInfo.aspx?pkId=" + model.UserId;

model.Content = new PageBase().InitContent(model.Content);

}

return list;
}
}
}

客户端、
$.ajax({
type: "POST",
contentType: "application/json",
data: { id: id },
dataType: 'json',
url: "../Service/test.asmx/GetList", success: function(msg) {

alert(msg);


}
});

.NET技术ASP.NET 李.net的主页 李.net | 老鸟四级 | 园豆:2643
提问于:2009-05-16 21:12
写“听云”原创博文,赢取iPhone 6超级大奖 收藏
最佳答案
1
data的写法不对,要写成
data: '{ id: ' + id + ' }'
注意data必须是一个“表示JSON对象的字符串”,而不是一个“JSON”对象
原因是jquery会把JSON对象序列化成标准POST的形式,你此处的{ id: id }会变成形好id=3这样的形式,而ASP.NET WebService需要的是JSON格式的数据,所以必须把你的数据变成一个JSON样子的字符串. jQuery AJAX 请求,后台收到为乱码
可以显式设置contentType的编码为utf-8, 后台一般都能正常解码例如:
[javascript] view plaincopy
contentType: "application/x-www-form-urlencoded; charset=utf-8",

[javascript] view plaincopy
jQuery(form).ajaxSubmit({
url: "doLogin?user=a",
type: "post",
dataType: "json",
contentType: "application/x-www-form-urlencoded; charset=utf-8",
success: showLoginResponse
});
如果不加contentType: "application/x-www-form-urlencoded; charset=UTF-8",而使用escape(),则会出现
post 主体包含的字节比内容长度指定的字节要少
的错误.

2.jQuery AJAX 返回乱码
你是否发现无论你怎么设置编码, 客户端收到的数据总是乱码呢, 请看下面的例子,你发现有什么问题吗?
[java] view plaincopy
void saveTempKind(HttpServletRequest req, HttpServletResponse resp)

throws ServletException, IOException {
PrintWriter pw = resp.getWriter();
resp.setContentType("text/text;charset=GBK");
try {
//DO PROCESS
pw.write("成功");
}catch(Exception e){
pw.write("失败");
}
}
问题在于resp.setContentType("text/text;charset=GBK"); 语句应该在
[javascript] view plaincopy
PrintWriter pw = resp.getWriter();
之前,而不是之后。如果象上例这样,无论你怎么设置response的编码,前端乱码的问题都依然如故。 可能的原因是pw在获得PriintWriter 之前,编码就已经确定了。所以编码的声明应该在获取PrintWriter对象之前http://blog.csdn.net/hongweigg/a ... 304201121393145234/
回复

使用道具 举报

千问 | 2005-10-30 17:05:33 | 显示全部楼层
为一些因素,必须改写WebService,很传统,但是很多公司还在用..
因为XML 的关系,不想让他传递数据的时候过度肥大,所以我必须要尽量干净的JSON..
于是开始我的改写旅程..

首先,网络上好多好多好多文件,可能因为状况不同,测试过许多也让我搞混很多次..
最后有找到答案..笔记一下..

首先我开了三个不同的WebMethod 来测试三种不同的输出..

GetUserInfoString –取得字符串
GetOneUserInfo - 取得一个对象
GetUsers - 取得对象们

view sourceprint?01.using System.Collections.Generic;
02.using System.Web.Script.Services;
03.using System.Web.Services;
04.

05.namespace JsonServiceSample
06.{
07.

08.
public class User
09.
{
10.
public string Name { get; set; }
11.
public int Age { get; set; }
12.
}
13.

14.

15.
[WebService(Namespace = "", Description = "For Donma Test")]
16.
[System.ComponentModel.ToolboxItem(false)]
17.
[ScriptService]
18.
public class Service1 : WebService
19.
{
20.

21.

22.
[WebMethod]
23.
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
24.
public string GetUserInfoString(string name, int age)
25.
{
26.

return name + "," + age;
27.
}
28.

29.

30.
[WebMethod]
31.
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
32.
public User GetOneUserInfo(string name, int age)
33.
{
34.

return (new User { Name = name, Age = age });
35.

36.
}
37.

38.

39.
[WebMethod]
40.
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
41.
public User[] GetUsers(string name, int age)
42.
{
43.

List[U] res = new List[U]();
44.

res.Add(new User { Name = name + "1", Age = age });
45.

res.Add(new User { Name = name + "2", Age = age });
46.

47.

return res.ToArray();
48.
}
49.

50.
}
51.}
再来一个重点,在每一个Method 上方我都会加上www.it165.net
[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
因为基于有时候我会需要使用GET 方式传递 所以我在Web Config 中加入
在system.web 中加入





Web.Config 全文:

view sourceprint?01.
02.

03.
07.

08.
09.

10.

11.

12.

13.

14.

15.

16.

17.

18.

19.

20.

21.

22.

23.

24.

25.

26.

27.

28.

29.

30.

31.
http://localhost:5403/Service1.asmx
32.

33.

34.

35.
这样试跑一下

\

奇怪为什么不是JSON ,别紧张…我们继续使用 JQuery 来呼叫看看..
JQuery Code :


view sourceprint?01.
02.

03.

按钮按下去之后 我让他呼叫 GetOneUserInfo 这 method
并且使用POST
看下结果..

\

恩恩..的确是JSON, 但是多了一个 d跟 __type 基本上__type 不要去动他是不影响,但是d 这东西必须得处理..
进行改写..实测过上面三种不同的回传值..都 OK~~
这样对于传统的 WebService Reference 呼叫WebService 不会有影响..
也可以透过JQuery 呼叫传递透过JSON…
http://www.it165.net/pro/html/201210/3891.html
回复

使用道具 举报

千问 | 2005-10-30 17:05:33 | 显示全部楼层
aJax处理中前后台数据交互用的比较多是就是JSON数据格式和xml格式,如果你用到Jquery,你会发现Jquery强大的选择器功能
在处理这样的问题是,今天分享一下我用jquery出来c#中webservice中的出了json和xml数据的方法;
前途代码:
$.(document).ready(function(){

$('#jsonbt').click(function(){


$.ajax({


url:"webservicedemo/GetJson",//webservice总返回Json数据的方法

type:'post',

data:"{}",

contentType:application/json,

success:function(res){

var data = res.d;//Net3.5

data = eval("("+data+")");

//data = $.parseJSON(''+data+'');//jquery1.4

each(data,function(index) {


var name = $(this).StuName;//student实体中的属性

var age = $(this).StuAge;

})

},

error:function(){

//

}

});
});

$('#xmlb').click(function(){


url:"webservicedemo/GetXml",//webservice总返回XML数据的方法

type:'post',

data:"{}",

contentType:application/xml,

success:function(res){

var data = res.d;//Net3.5

data = eval("("+data+")");

//data = $.parseJSON(''+data+'');//jquery1.4

$(data).find('Student').each(function(){

var name = $(this).find('StuName').text();

var age = $(this).find('StuAge').text();


})

}
});
});http://blog.csdn.net/yuefengyuan/article/details/6074162李开复给计算机专业学生的七大建议
分类: 生活琐事 2010-12-06 22:50 204人阅读 评论(0) 收藏 举报
google图像处理数据结构工作算法编程
很多在校的大学同学问我们:“我今年还没有到毕业班,但我很想知道,如果将来想申请Google中国工程研究院,现在应该如何让自己做好准备?”下面是Google中国总裁李开复博士和其他一些Google资深的华人工程师给广大同学的建议。
(1)练内功。不要只花功夫学习各种流行的编程语言和工具,以及一些公司招聘广告上要求的科目。要把数据结构、算法、数据库、操作系统原理、计算机体系结构、计算机网络,离散数学等基础课程学好。不妨试试Donald Knuth的Art of Computer Programming里的题目,如果你能够解决其中的大部分题目,就说明你在算法方面的功力不错了。
(2)多实战。通过编程的实战积累经验、内化知识。建议大家争取在大学四年中积累编写十万行代码的经验。
(3)求实干。不要轻视任何的实际工作,比如一些看似简单的编码或测试。要不懈追求对细节一丝不苟的实干作风与职业精神。
(4)不放弃数学。数学是思维的体操,数学无处不在。尤其当你对一些“数学密集型”的领域有兴趣,例如视频、图像处理等等,你需要使它成为你的利器。
(5)培养团队精神,学会与人合作。
(6)激励创新意识,不为书本和权威意见所束缚。
(7)有策略地“打工”。在不影响学业的前提下,寻找真正有意义的暑期工作或兼职。去找一个重视技术的公司,在一个好的“老板”指导下完成真正会被用户使用的程序。不要急于去一个要你做“头”而独挡一面的地方,因为向别人学习,是你的目的。打工和找工作一样,“不要只看待遇和职衔,要挑一个你能够学习的环境,一个愿意培养员工的企业,一个重视你的专业的公司,最后,要挑一个好老板。
回复

使用道具 举报

千问 | 2005-10-30 17:05:33 | 显示全部楼层
http://blog.sina.com.cn/s/blog_4f925fc30100la36.htmlurl: 要求为String类型的参数,(默认为当前页地址)发送请求的地址。
type: 要求为String类型的参数,请求方式(post或get)默认为get。注意其他http请求方法,例如put和
delete也可以使用,但仅部分浏览器支持。
timeout: 要求为Number类型的参数,设置请求超时时间(毫秒)。此设置将覆盖$.ajaxSetup()方法的全局设
置。
async:要求为Boolean类型的参数,默认设置为true,所有请求均为异步请求。
如果需要发送同步请求,请将此选项设置为false。注意,同步请求将锁住浏览器,用户其他操作必须等
待请求完成才可以执行。
cache:要求为Boolean类型的参数,默认为true(当dataType为script时,默认为false)。
设置为false将不会从浏览器缓存中加载请求信息。
data: 要求为Object或String类型的参数,发送到服务器的数据。如果已经不是字符串,将自动转换为字符串格
式。get请求中将附加在url后。防止这种自动转换,可以查看processData选项。对象必须为key/value格
式,例如{foo1:"bar1",foo2:"bar2"}转换为&foo1=bar1&foo2=bar2。如果是数组,JQuery将自动为不同
值对应同一个名称。例如{foo:["bar1","bar2"]}转换为&foo=bar1&foo=bar2。
dataType: 要求为String类型的参数,预期服务器返回的数据类型。如果不指定,JQuery将自动根据http包mime

信息返回responseXML或responseText,并作为回调函数参数传递。

可用的类型如下:

xml:返回XML文档,可用JQuery处理。

html:返回纯文本HTML信息;包含的script标签会在插入DOM时执行。

script:返回纯文本JavaScript代码。不会自动缓存结果。除非设置了cache参数。注意在远程请求

时(不在同一个域下),所有post请求都将转为get请求。

json:返回JSON数据。

jsonp:JSONP格式。使用SONP形式调用函数时,例如myurl?callback=?,JQuery将自动替换后一个

“?”为正确的函数名,以执行回调函数。

text:返回纯文本字符串。
beforeSend:要求为Function类型的参数,发送请求前可以修改XMLHttpRequest对象的函数,例如添加自定义

HTTP头。在beforeSend中如果返回false可以取消本次ajax请求。XMLHttpRequest对象是惟一的参

数。

function(XMLHttpRequest){

this; //调用本次ajax请求时传递的options参数

}
complete:要求为Function类型的参数,请求完成后调用的回调函数(请求成功或失败时均调用)。

参数:XMLHttpRequest对象和一个描述成功请求类型的字符串。

function(XMLHttpRequest, textStatus){

this;//调用本次ajax请求时传递的options参数

}
success:要求为Function类型的参数,请求成功后调用的回调函数,有两个参数。
(1)由服务器返回,并根据dataType参数进行处理后的数据。
(2)描述状态的字符串。
function(data, textStatus){

//data可能是xmlDoc、jsonObj、html、text等等

this;//调用本次ajax请求时传递的options参数
error:要求为Function类型的参数,请求失败时被调用的函数。该函数有3个参数,即XMLHttpRequest对象、错
误信息、捕获的错误对象(可选)。
ajax事件函数如下:
function(XMLHttpRequest, textStatus, errorThrown){

//通常情况下textStatus和errorThrown只有其中一个包含信息

this; //调用本次ajax请求时传递的options参数
}
contentType:要求为String类型的参数,当发送信息至服务器时,内容编码类型默认

为"application/x-www-form-urlencoded"。该默认值适合大多数应用场合。
dataFilter:要求为Function类型的参数,给Ajax返回的原始数据进行预处理的函数。

提供data和type两个参数。data是Ajax返回的原始数据,type是调用jQuery.ajax时提供的

dataType参数。函数返回的值将由jQuery进一步处理。

function(data, type){

//返回处理后的数据

return data;

}
global:要求为Boolean类型的参数,默认为true。表示是否触发全局ajax事件。设置为false将不会触发全局
ajax事件,ajaxStart或ajaxStop可用于控制各种ajax事件。
ifModified:要求为Boolean类型的参数,默认为false。仅在服务器数据改变时获取新数据。

服务器数据改变判断的依据是Last-Modified头信息。默认值是false,即忽略头信息。
jsonp:要求为String类型的参数,在一个jsonp请求中重写回调函数的名字。
该值用来替代在"callback=?"这种GET或POST请求中URL参数里的"callback"部分,例如
{jsonp:'onJsonPLoad'}会导致将"onJsonPLoad=?"传给服务器。
username:要求为String类型的参数,用于响应HTTP访问认证请求的用户名。
password:要求为String类型的参数,用于响应HTTP访问认证请求的密码。
processData:要求为Boolean类型的参数,默认为true。默认情况下,发送的数据将被转换为对象(从技术角度

来讲并非字符串)以配合默认内容类型"application/x-www-form-urlencoded"。如果要发送DOM

树信息或者其他不希望转换的信息,请设置为false。
scriptCharset:要求为String类型的参数,只有当请求时dataType为"jsonp"或者"script",并且type是GET时

才会用于强制修改字符集(charset)。通常在本地和远程的内容编码不同时使用。

案例代码:
$(function(){
$('#send').click(function(){
$.ajax({

type: "GET",

url: "test.json",

data: {username:$("#username").val(), content:$("#content").val()},

dataType: "json",

success: function(data){

$('#resText').empty(); //清空resText里面的所有内容

var html = '';

$.each(data, function(commentIndex, comment){

html += '' + comment['username']

+ ':
';

});

$('#resText').html(html);

}
});
});
});

顺便说一下$.each()函数:
$.each()函数不同于JQuery对象的each()方法,它是一个全局函数,不操作JQuery对象,而是以一个数组或者对象作为第1个参数,以一个回调函数作为第2个参数。回调函数拥有两个参数:第1个为对象的成员或数组的索引,第2个为对应变量或内容。JQuery的Ajax主要方法有
jQuery.ajax(options)
load(url,data,callback)
jQuery.get(url,data,callback)
jQuery.getJSON(url,data,callback)
jQuery.getScript(url,callback)
jQuery.post(url,data,callback)
在这里面我要说的是,一般初学者都会拿最简单的例子来写。比如这里的jQuery.get(url,data,callback)
Demo1:$.get("webservice路径/webservice名/方法名","{参数1:value1,参数2:value2...}",function(msg){alert(msg)})
无论怎么样都不能弹出,而且没有js报错。这里我最初的想法是考虑JQuery的问题,但是后来一一排出,因为如果把第一个参数换成"test.asp"这样的页面就可以获得结果。但是还是有问题,弹出不是我想要的值,但是最少已经能够弹出了。
然后我突然想起来了,webservice要post提交,所以这里只能用$.post方法。
Demo2:$.post("webservice路径/webservice名/方法名","{参数1:value1,参数2:value2...}",function(msg){alert(msg)})
这时候有弹出提示,但是提示信息为[object],然后继续找问题,查了一下JQuery的Docs才发现,需要设置contentType才可以按照字符串显示,否则将会按照HTTP返回的MIME类型解析。而webservice返回的是一个xml对象,所以这里不能正常显示。
所以这里要弹出返回的字符串,就必须设置contentType。而这里能设置的就需要用最麻烦也最万能的$.ajax
最后的Demo3:
$.ajax({
contentType:"html",
data:{inputString,"John"},
url:"webservice路径/webservice名/方法名",
function(msg){
alert(msg);http://www.cnblogs.com/52x/archive/2008/03/07/1094863.htmlhttp://blog.itpub.net/221062/viewspace-580298/ 4种方法http://www.cnblogs.com/haitao-fan/p/3908973.html
回复

使用道具 举报

千问 | 2005-10-30 17:05:33 | 显示全部楼层
最近专注研究 jQuery Mobile —— 一款很方便就可以把 Web App 包装成适合 Android 与 iPhone 等触屏移动设备的 Javascript 库,结合 jQuery Mobile 与 HTML5 ,可以很方便的开发出一款具有良好界面及用户体验的 Web App,在这个过程中我收获良多,因此决定针对使用 jQuery Mobile 与 HTML5 开发 Web App 写一个系列的文章。在开始之前,我首先简述 Web App 与原生 App 各自的优缺点。

一. Web App 与原生 App 的优缺点
1.Web App
(1).优点
1.开发成本低,周期短, Web 开发者可以使用现成的工具及开发技术。
2.跨平台,用户只需要一个标准的移动浏览器。
3.维护方便,维护不干扰用户使用,可实时修复 Bug。

(2).缺点
1.无法调用手机硬件,用户体验较原生 App 薄弱。
2.运行不够原生 App 流畅。
3.需要网络的支持(可依靠 HTML5 大大减少对网络的依赖)。

2.原生 App
(1).优点
1.可以调用手机硬件提供的功能,具有出色的用户体验。
2.不依赖网络。
3.开发者更易获得盈利。

(2).缺点
1.需要移植到不同平台时较为麻烦。
2.维护成本高。
3.开发周期长。
4.需要 App Store 或 Android Market 的确认,并且要与第三方分享盈利。

看了以上的优缺点,可以看出 Web App 具有很好的优势,并且随着移动设备硬件配置的逐年升级,Web App 的劣势将会逐渐减弱,而优势将更加明显,虽然仍不能完全取代原生 App , 但 Web App 队伍将不断壮大已经形成趋势,因此作为 Web 开发者投入到 Web App 的开发中也是一种很好的选择。当然原生 App 仍有其优势,因此在本系列文章的最后, Kayo 会介绍一种方法将 Web App 转换为原生的 App 。

二.使用 jQuery Mobile 与 HTML5 开发 Web App
既然 Web App 具有很多的优势,那么应该如何使用 Web 开发技术开发出一款优秀的 Web App 呢?

首先我们必须知道,一款优秀的 Web App ,需要有良好的 UI 与用户体验(UE),虽然本质上作为一个站点,内容才是用户需要的,但我们仍需要使用良好的 UI 与 UE 来作为内容与用户的连接,因此我们引入 jQuery Mobile 来为 Web App 制作 UI 与交互。

有了 Web App 的界面,还需要数据的交互,这样才能做出 App 。这里可以使用 PHP 等服务器脚本与 Mysql 等数据库来为 Web App 提供数据驱动,但 Kayo 希望采用一种新的方法,也就是 HTML5 的方法,使用 HTML5 规范提供的 Web SQL Database —— 一个简单强大的 Javascript 数据库 API, 可以在本地数据库中存储数据(如内嵌在浏览器中的 SQLite ),另外还可以使用 HTML5 规范中的 Storage (本地储存) 来储存数据,这样就可以减少 Web App 对于网络的依赖,并且整个 Web App 都是使用前端的技术完成(很震撼吧!)。

最后不得不提的是 offline application cache (离线程序缓存),它也是 HTML5 的特性,允许用户在无网络连接的情况下运行 Web App,因此我们可以利用此特性制作支持离线使用的 Web App ,进一步减少 Web App 对于网络的依赖。

三.响应式设计
响应式网页设计由 Ethan Marcotte 提出,通俗点说,就是网站界面能够兼容多种终端,而不是每种终端各自做一个界面。腾讯等大型网站都有针对不同的设备做出不同的界面,比如 3g 版,触屏版,ipad……,这样就会增加了很多重复的工作量,因此我们可以为网站渐进的设计一个界面,自动适应不同的设备,当然设备间的效果可以有所差距。这里 Kayo 小插一段,Kayo 认为响应式设计的诞生,很大程度上归功于移动互联网的发展与移动设备硬件的提升,而移动互联网的发展本身也依赖于移动设备硬件的提升,因此想不断提升的 App ,还得先要硬件厂商给力。

言归正传,这里提到响应式设计的理念当然是希望在设计 Web App 时也应用到,而这些 jQuery Mobile 已经为开发者预先做好, jQuery Mobile 不但默认的 UI 样式里已经按响应式设计做好,它还另外提供了一些为响应式设计而做的方法,日后会详细介绍。

四.渐进式设计
Kayo 在之前介绍 jQuery Mobile 的文章《jQuery Mobile 特性》时已经提到过渐进式设计,下面引用文中的话:

“前端设计时通过渐进增强功能来设计一直也是 Kayo 的设计想法,因为不同的平台,不同的设备有着不同的 Web 环境,因此对于一些出色的前端效果很难保证在每台设备上都呈现相同的效果,因此与其为了在所有设备上做到一样的效果而降低整体的前端样式,不如对于好的设备可以呈现更出色的效果,而基本的效果就兼容所有的设备。jQuery Mobile 的设计也是如此,核心的功能支持所有的设备,而较新的设备则可以获得更为优秀的页面效果。”【兼容】

这里使用 jQuery Mobile 的目的非常明显,也就是使到 Web App 能尽量兼容不同的设备并且在较为先进的设备中呈现更加出色的表现,而不要为了统一而牺牲优秀的设计。

五.作品
下面是利用上文提到的各种技术做出的成品—— Do.It ,一款 Web App 备忘,添加的事项默认会到“今天”这一栏,若今天的事情不完成,明天继续添加,则会越来越多,所以今天的事情要今天完成噢!在触摸设备上向右划动事项则为完成事项(电脑的话也可以按住鼠标划动,不过不易成功)。另外用户不需注册可以直接使用,该 Web App 采用 Web SQL Database 存储数据,数据存在设备本地,因此没有注册,登陆的麻烦,方便吧!还有其他功能欢迎体验!
各位可以使用 webkit 内核的设备浏览下面的地址(PC 上的 Chrome, Safari ,以及 Android , iPhone/iPad 上的系统浏览器。)
http://kayosite.com/doit/http://www.cnblogs.com/itxiaoyan2013/p/3183908.html
http://blog.csdn.net/adparking/article/details/38142145
http://blog.csdn.net/bookzhaopin/article/details/38382907
回复

使用道具 举报

千问 | 2005-10-30 17:05:33 | 显示全部楼层
本帖最后由 liyihongcug 于 2014-12-22 11:30 编辑
http://www.imooc.com/view/94?from=cnblogs http://article.phpchina.com/inde ... tid=75&id=13366http://blog.csdn.net/zuoxiaolong8810/article/details/8546527 http://www.jb51.net/article/20355.htmhttp://wenku.baidu.com/link?url= ... YqXqluuDQAfWL5Lqmlm
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

主题

0

回帖

4882万

积分

论坛元老

Rank: 8Rank: 8

积分
48824836
热门排行