例如:在前台获取了一个值 “D11”
如何将D11传给后台.ashx文件里通过语句select * from table where ID="D11";
再将给过返回给前台。
这个语句怎么写啊。
怎样将D11传递到后台去啊!
ajax设置一个url和post/get方法,然后写一个函数接受状态码==200处理。js是这样的
1》前台
首先需要 Jquery的包
复制代码 代码如下:
<script src="js/jquery-1.9.1.js" type="text/javascript"></script>
下面是 <script type="text/javascript">
$(function () {
$('#txtUserName').blur(function () {
var username = $(this).val();
$.ajax({
type: "post",
contentType: "application/json",//传值的方式
url: "WebAjaxForMe.aspx/GetValueAjax",//WebAjaxForMe.aspx为目标文件,GetValueAjax为目标文件中的方法
data: "{username:'" + username + "'}",//username 为想问后台传的参数(这里的参数可有可无)
success: function (result) {
alert(result.d);//result.d为后台返回的参数
}
})
})
})
</script>
//这里是参数的来源
<input id="txtUserName" type="text" />
2》后台
在后台首先要添加using System.Web.Services;的引用
复制代码 代码如下:
[WebMethod]//方法前边必须添加 [WebMethod]
public static string GetValueAjax(string username)//这个方法需要是静态的方法要用到关键字static
{
//在这里可以对传进来的参数进行任何操作
return username;
}
1、无参数的方法调用, 注意:1.方法一定要静态方法,而且要有[WebMethod]的声明
后台:
using System.Web.Script.Services;
[WebMethod]
public static string SayHello()
{
return "Hello Ajax!";
}
前台:
$(function() {
$("#btnOK").click(function() {
$.ajax({
//要用post方式
type: "Post",
//方法所在页面和方法名
url: "data.aspx/SayHello",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(data) {
//返回的数据用data.d获取内容
alert(data.d);
},
error: function(err) {
alert(err);
}
});
//禁用按钮的提交
return false;
});
});
2、带参数的方法调用
后台:
using System.Web.Script.Services;
[WebMethod]
public static string GetStr(string str, string str2)
{
return str + str2;
}
前台:
$(function() {
$("#btnOK").click(function() {
$.ajax({
type: "Post",
url: "data.aspx/GetStr",
//方法传参的写法一定要对,str为形参的名字,str2为第二个形参的名字
data: "{'str':'我是','str2':'XXX'}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(data) {
//返回的数据用data.d获取内容
alert(data.d);
},
error: function(err) {
alert(err);
}
});
//禁用按钮的提交
return false;
});
});
3、返回数组方法的调用
后台:
using System.Web.Script.Services;
[WebMethod]
public static List GetArray()
{
List li = new List();
for (int i = 0; i < 10; i++)
li.Add(i + "");
return li;
}
前台:
$(function() {
$("#btnOK").click(function() {
$.ajax({
type: "Post",
url: "data.aspx/GetArray",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(data) {
//插入前先清空ul
$("#list").html("");
//递归获取数据
$(data.d).each(function() {
//插入结果到li里面
$("#list").append("<li>" + this + "</li>");
});
alert(data.d);
},
error: function(err) {
alert(err);
}
});
//禁用按钮的提交
return false;
});
});
///
$(function() {
$("#btnOK").click(function() {
$.ajax({
type: "Post",
url: "data.aspx/GetArray",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(data) {
//插入前先清空ul
$("#list").html("");
//递归获取数据
$(data.d).each(function() {
//插入结果到li里面
$("#list").append("<li>" + this + "</li>");
});
alert(data.d);
},
error: function(err) {
alert(err);
}
});
//禁用按钮的提交
return false;
});
});
4、返回Hashtable方法的调用
后台:
using System.Web.Script.Services;
using System.Collections;
[WebMethod]
public static Hashtable GetHash(string key,string value)
{
Hashtable hs = new Hashtable();
hs.Add("www", "yahooooooo");
hs.Add(key, value);
return hs;
}
前台:
$(function() {
$("#btnOK").click(function() {
$.ajax({
type: "Post",
url: "data.aspx/GetHash",
//记得加双引号 T_T
data: "{ 'key': 'haha', 'value': '哈哈!' }",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(data) {
alert("key: haha ==> "+data.d["haha"]+"\n key: www ==> "+data.d["www"]);
},
error: function(err) {
alert(err + "err");
}
});
//禁用按钮的提交
return false;
});
});
5、操作xml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
XMLtest.xml:
view plaincopy to clipboardprint?
<?xml version="1.0" encoding="utf-8" ?>
1
qwe
2
asd
<?xml version="1.0" encoding="utf-8" ?>
1
qwe
2
asd
前台:
$(function() {
$("#btnOK").click(function() {
$.ajax({
url: "XMLtest.xml",
dataType: 'xml', //返回的类型为XML ,和前面的Json,不一样了
success: function(xml) {
//清空list
$("#list").html("");
//查找xml元素
$(xml).find("data>item").each(function() {
$("#list").append("
//禁用按钮的提交
return false;
});
});
jquery load方法就行
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.2.min.js"></script>
<div id="div"></div>
<script>
$('#div').load('xxxx.aspx?v=D11');
</script>
xxxx.aspx.cs
protected void Page_Load(object sender,EventArgs e){
string v=Request.QueryString["v"];
string sql="select * from table where ID='"+v+"'";
///查询操作,然后输出结果html代码就行
Response.End();//技术其他内容输出
}