为什么这在jQuery中不起作用？

我有两个下拉列表：

<select class="cityId form-control" dir="rtl">
@foreach (var city in Paristan.AgencyPortal.UI.Areas.Cpanel.Components.DropdownHelper.GetCities())
{
    <option value="@city.Value">@city.Text</option>
}
</select>
<select name="travelAirports" class="airports form-control" dir="rtl">
    <option>Select a City</option>
</select>


$(document).on("change", ".cityId", function () {
        $.getJSON("/Cpanel/Package/GetAirportsByCityId", { cityId: $(this).val() }, function (data) {
        $(this).next(".airports").empty();
        for (var i = 0; i < data.length; i++) {
        $(this).next(".airports").append("<option value='" + data[i].AirportId + "'>" + data[i].Name + "</option>");
        }
    });
});

---

此

在ajax回调中并不是指更改后的

cityId

元素，而是指用于发出请求的ajax设置对象

您可以使用闭包变量来解决此问题，如

$(document).on("change", ".cityId", function () {
    var $this = $(this);
    $.getJSON("/Cpanel/Package/GetAirportsByCityId", {
        cityId: $(this).val()
    }, function (data) {
        $this.next(".airports").empty();
        for (var i = 0; i < data.length; i++) {
            $this.next(".airports").append("<option value='" + data[i].AirportId + "'>" + data[i].Name + "</option>");
        }
    });
});

$（document）.on（“change”、“.cityId”，函数（）{
var$this=$（this）；
$.getJSON（“/Cpanel/Package/GetAirportsByCityId”{
cityId:$（this.val（））
}，函数（数据）{
$this.next（“.airports”）.empty（）；
对于（变量i=0；i

这是因为select元素的上下文在

$.getJSON

中丢失。在getJson调用之前在变量中声明上下文，并在success函数中使用它：

var self = $(this);
$.getJSON("/Cpanel/Package/GetAirportsByCityId", {
    cityId: $(this).val()
   }, function (data) {
    self.next(".airports").empty();
    for (var i = 0; i < data.length; i++) {
        self.next(".airports").append("<option value='" + data[i].AirportId + "'>" + data[i].Name + "</option>");
    }
});

var self=$（这是）；
$.getJSON（“/Cpanel/Package/GetAirportsByCityId”{
cityId:$（this.val（））
}，函数（数据）{
self.next（“.airports”）.empty（）；
对于（变量i=0；i

---

另外，如果您使用

$.ajax

而不是

$.getJSON

，那么您可以使用

上下文

选项。

但我记得我以前在getJSON中使用过$（this）。这与jQuery版本有关吗？

var self = $(this);
$.getJSON("/Cpanel/Package/GetAirportsByCityId", {
    cityId: $(this).val()
   }, function (data) {
    self.next(".airports").empty();
    for (var i = 0; i < data.length; i++) {
        self.next(".airports").append("<option value='" + data[i].AirportId + "'>" + data[i].Name + "</option>");
    }
});