一、下载jquery.js文件,这个有很多版本的,百度一下自行下载,我这里测试时用jquery-1.4.2.min.js。
二、创建cs的方法,待javascript测试调用。
cs的方法必须声明为public static才行,而且前面还要添加“[WebMethod]”,这时候要引入包using System.Web.Services;。
例如:
[WebMethod]
public static string getString(string str)
{
return “aaa”;
}
三、在aspx、htm等页面进行调用cs的方法。
3.1首先htm页面要引入jquery-1.4.2.min.js文件。
<script src="js/jquery-1.4.2.min.js" language="javascript" type="text/javascript"></script>
3.2然后创建一个通用的javaScript方法getValueByAjax(requestUrl, paramsString)来调用cs的方法,这样就很方便了,具体调用方法如下:
假如cs方法是test.aspx.cs里面有两个方法,一个是没有参数的,一个是有参数的,
[WebMethod]
public static string getName()
{
return “aaa”;
}
[WebMethod]
public static string getString(string str,int id)
{
return str+"_"+id;
}
这时候在javascript里面调用如下:
var name = getValueByAjax("test.aspx\getName");
var str = getValueByAjax("test.aspx\getName","str:'"+"hahaha’,id:"+123);
在这里要特别注意一下:getValueByAjax方法的参数paramsString可以多个,或者没有,这个要根据调用的cs方法的参数有关系,paramsString的输入值是与cs方法的参数名称和类型有关系的,格式是:参数名称:参数值,假如参数是字符串则参数值还要加上单引号“‘”。
四、完整的代码。
cs代码:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.Services;
public partial class ObjManage : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
[WebMethod]
public static string getString()
{
return "This is JQuery";
}
[WebMethod]
public static string getName(string name,int id)
{
return name + "_" + id;
}
}
htm代码:
<!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>
<script src="js/jquery-1.4.2.min.js" language="javascript" type="text/javascript"></script>
<script type="text/javascript">
var ajaxType = "Post";
var ajaxAsync = false;
var ajaxContentType = "application/json; charset=utf-8";
var ajaxDataType = "json";
function getValueByAjax(requestUrl, paramsString) {
var strRetValue = "";
if (paramsString != null)
paramsString = "{" + paramsString + "}";
$.ajax({
type: ajaxType,
async: ajaxAsync,
url: requestUrl,
contentType: ajaxContentType,
dataType: ajaxDataType,
data: paramsString,
success: function(data) {
strRetValue = data.d;
},
error: function(err) {
strRetValue = "";
}
});
return String(strRetValue);
}
function alertString() {
var str = getValueByAjax("ObjManage.aspx/getString");
alert(str);
var name = getValueByAjax("ObjManage.aspx/getName", "name:'Jony', id:" + 123);
alert(name);
}
</script>
</head>
<body>
<input type="button" value="获取信息" οnclick="alertString();" />
</body>
</html>
以上都通过了测试,假如哪位有什么问题,可留言!