假设我在SQL Server数据库中有一个表，看起来像
StateName notes
alabama 'notes about alabama'
alaska 'notes about alaska'
..... .........
编辑：这个问题将分为两个部分，一个是针对最初的问题，一个是为什么它不起作用，而我是经过改革的，希望是更准确的第二个解决方案。
在Web表单中，状态名称在表内部表示为链接按钮。当用户单击状态名称时，我试图使用jQuery进行Ajax数据库调用，链接按钮的文本值将被发送到数据库中的存储过程。
该存储过程类似于
create proc spGetStateData
@stateName varchar(50)
as
begin
select notes from
states
where statename = @stateName
end
为了进行测试，我添加了一个文本框和一个按钮，以便当用户在文本框中键入状态名称时，显示Notes数据库表中的States列。
[WebMethod]
public static string GetStateData(string stateName)
{
string stateNotes = string.Empty;
string cs = ConfigurationManager.ConnectionStrings["dbcs"].ConnectionString;
using (SqlConnection con = new SqlConnection(cs))
{
using (SqlCommand cmd = new SqlCommand("spGetStateData", con))
{
con.Open();
cmd.CommandType = CommandType.StoredProcedure;
cmd.Parameters.AddWithValue("@stateName", stateName);
stateNotes = cmd.ExecuteScalar().ToString();
}
}
return stateNotes;
}
protected void btnSubmit_Click(object sender, EventArgs e)
{
lblStateNotes.Text = GetStateData(txtStateName.Text);
hiddenDiv.Visible = true;
}
这部分有效，所以我知道不是我的WebMethod或数据库连接失败。当我尝试使用jQuery做同样的事情时，它失败了。
<script type="text/javascript" language="javascript">
$(document).ready(function () {
$("#states a").click(function () {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "WebForm1.aspx/GetStateData",
data: $(this).text(),
dataType: "json",
success: function (data) {
response(data.d);
},
error: function (x) {
alert('error');
}
});
});
});
</script>
好的，我打开了用于Chrome的开发人员工具，发现导致AJAX失败的原因是我遇到了“无法加载资源HTTP 500错误”。告诉我找不到方法名称和参数（即使按权利列出）。因此，我尝试了第二种方法，这似乎是一种更好的方法（如果我能使它工作的话！）
因此，我想到了“让我们使用WebService”。这是我的解释：
<!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 runat="server">
<title></title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("a").click(function () {
var stateName = JSON.stringify({ "stateName": $(this).text() });
$.ajax({
type: "POST",
url: "GetStateData.asmx/GetData",
contentType: "application/json; charset=utf-8",
data: stateName,
dataType: "json",
success: function (data) {
$("#lblNotes").text(data);
},
error: function (x) {
alert('message');
}
});
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<a href="#">Alabama</a>
<a href="#">Alaska</a>
<asp:Label runat="server" ID="lblNotes"></asp:Label>
</div>
</form>
</body>
</html>
网络服务：
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Configuration;
using System.Data;
using System.Data.SqlClient;
using System.Web.Script.Services;
namespace jQueryAjaxWebservice
{
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.ComponentModel.ToolboxItem(false)]
[System.Web.Script.Services.ScriptService]
public class GetStateData : System.Web.Services.WebService
{
[WebMethod]
[ScriptMethod]
public string GetData(string stateName)
{
string cs = ConfigurationManager.ConnectionStrings["dbcs"].ConnectionString;
string stateNotes ="test" ;
using (SqlConnection con = new SqlConnection(cs))
{
using (SqlCommand cmd = new SqlCommand("spGetStateData",con))
{
con.Open();
cmd.CommandType = CommandType.StoredProcedure;
cmd.Parameters.AddWithValue("@stateName", stateName);
stateNotes = cmd.ExecuteScalar().ToString();
}
}
return stateNotes;
}
}
}
我已经测试过WebService，并且可以正常工作。但是，当我尝试从default.aspx调用Web服务代码时，我得到[Object object]作为lblNotes文本。如果我将（数据）更改为“测试”，那么我会在屏幕上获得“测试”的正确输出。因此，故障部分在Ajax调用的success部分中。我在GetData函数上设置了一个断点，并且stateNotes接收到正确的文本值，因此问题唯一剩下的地方就是ajax调用的success行。
参考方案
我认为在data中格式化ajax选项的方式可能是错误的。它始终在键值对中工作。在当前表单中，您只发送值，没有键。您可能需要将其更改为以下格式：
var stateName = { "stateName" : $(this).text()}
要么
var stateName = JSON.stringify({ "stateName" : $(this).text()})
但大多数情况下，我只看到了第二个代码，部分原因是jQuery并未对其data选项进行预处理，因为它在C＃中可读。因此，始终建议在stringify设置为ajax的type请求上使用"POST"。
然后，在您的ajax通话中，
$.ajax({
//ajax options
data : stateName
//some more ajax options
});
另外，您可能希望使error选项更具描述性，如下所示：
$.ajax({
//ajax options
error: function (xhr, ajaxOptions, thrownError) {
alert(xhr.status);
alert(thrownError);
}
});
这将告诉您哪里出了问题，也可以对其进行调试。
编辑：
在success函数中，尝试查找data.d而不是data。您会发现您的数据位于其中。另外，如前所述（我对此压力不足），请使用带有error选项的xhr处理程序。这样，调试起来会更容易。 Read this if you want to know why the result returns data.d and not just data.
$.ajax({
//some ajax options
success: function (data) {
//data.d will contain your data
console.log(data.d);
$("#lblNotes").text(data.d);
},
error: function (xhr, ajaxOptions, thrownError) {
console.log(xhr);
alert(xhr.status);
alert(thrownError);
}
});
希望这可以帮助！
jQuery不起作用 - php我正在使用带有ajax的jquery。有时，给出错误$未定义。这是我的代码：<script language="javascript" type="text/javascript"> var base_path="<? echo $this->baseUrl().'/…
Div单击与单选按钮相同吗？ - php有没有一种方法可以使div上的click事件与表单环境中的单选按钮相同？我只希望下面的div提交值，单选按钮很丑代码输出如下：<input id="radio-2011-06-08" value="2011-06-08" type="radio" name="radio_date&#…
故障排除“警告:session_start():无法发送会话高速缓存限制器-标头已发送” - php我收到警告：session_start（）[function.session-start]：无法发送会话缓存限制器-标头已发送（错误输出开始如果我将表单数据提交到其他文件进行处理，则可以正常工作。但是，如果我将表单数据提交到同一页面，则会出现此错误。请建议<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0…
CodeIgniter更新查询被执行两次 - php我正在使用CodeIgniter 2.2。每次访问页面时，我都必须用+1更新数据库。代码可以工作，但是每次都会增加+2。示例：如果是total views=2，则在单击页面后total views应该是3，但是数据库中的值是4。我确定我在控制器中仅调用一次模型add_one_to_view_image。控制者 function view(){ $view_i…
jQuery Ajax文件上传在客户端浏览器上无法正常工作 - javascript我正在尝试使用Ajax和JQuery实现个人资料图片上传功能我能够将个人资料图片成功上传到我尝试过的所有机器和移动设备上的数据库中。它适用于我在Chrome，Edge，Firefox，Safari甚至Vivaldi上使用。问题是我住在加拿大的客户无法将他们的个人资料图片上传到数据库。另外，纵向宽高比的图像倾向于向侧面旋转。我一直在要求他重新注册并多次提供…