重构 AJAX 发布函数：获取已更改的字段 ID 并使用 AJAX 发布其值

Question

我是一名新开发人员，正在问我的第一个SO问题：(。在ASP.NET MVC中，处理具有基于相应文本输入的一些计算字段的表单。本质上，从文本框中获取值，AJAX将该值发布到控制器，执行计算，将该数据返回到只读计算字段。

我有以下代码用于此工作：

$("#volume").focusout(function () {
volume = $(this).val()
$.ajax({
type: "POST",
url: '/StaffingPlan/CalculatorAction',
data: { volume: volume },
dataType: "json",
success: function (data) {
console.log(data);
$("#selectorsNeeded").val(data);
}
});
});
$("#drops").focusout(function () {
drops = $(this).val()
$.ajax({
type: "POST",
url: '/StaffingPlan/CalculatorAction',
data: { drops: drops },
dataType: "json",
success: function (data) {
console.log(data);
$("#liftsNeeded").val(data);
}
});
});

在控制器中：

public ActionResult CalculatorAction(string volume, string drops)
{
int data = 0;
//one calculation performed for volume, but will be others to calculate
if (volume != null && volume != "")
{
data = Int32.Parse(volume) / 150 / 9;
}
//example of another calc
if (drops != null && drops != "")
{
data = Int32.Parse(drops) / 25 / 6;
}

return Json(data, JsonRequestBehavior.AllowGet);
}

然而，这是可行的，表单有其他几个输入和计算字段。显然，有更好/更干燥的方式来写这篇文章，而不是复制.focusout函数。如果只获取更改的字段ID并将值分配给适当的变量，那就太好了。希望这是有道理的！任何指示都将不胜感激。

Answer 1

将代码更改为：

$("#volume").focusout(function () {

var data= { volume: $(this).val()},
var resultField=  $("#selectorsNeeded");
calculateResult(data, resultField);
});    
$("#drops").focusout(function () {

var data= { drops: $(this).val() },
var resultField=  $("#liftsNeeded");
calculateResult(data, resultField);
});   
function calculateResult (data, resultField) {
$.ajax({
type: "POST",
url: '/StaffingPlan/CalculatorAction',
data: data,
dataType: "json",
success: function (result) {
console.log(result);
resultField.val(result);
}
});
};