为什么这个JS var在AJAX之后会失去价值?

时间:2012-08-25 02:05:05

标签: javascript jquery ajax

请考虑以下代码段:

$('.job-details-apply').live('click', function () {
    var url = $('#apply-job-url').val();
    var id = $(this).attr('value');
    var selected = $(this);
    $.ajax({
        url: url,
        data: { id: id },
        success: function (data) {
            $(selected).html('Test!');//selected is undefined at this point
        },
        error: function () {
        }
    });
    return false;
});

成功处理程序中未定义var selected。我是否需要将其范围限制在点击功能之外? e.g。

var selected = null;
$('.job-details-apply').live('click', function () {
    selected = $(this);
    //blah
}

对我来说这似乎不对。

编辑:如果它有所不同,那么从控制器返回的值为JsonResult(此时它只是一个布尔)

3 个答案:

答案 0 :(得分:3)

您无需更改selected变量的声明方式。它将在你的ajax函数的成功处理程序中正常使用。

作为jQuery ajax成功处理程序偶尔混淆的一点,但不是这个问题的原因,this的值在你的ajax成功处理程序中会有所不同(它会指向一个ajax对象),但是这不会影响对父函数中声明的变量的访问,因为它们可以在不使用this的情况下直接使用。

所以,既然你所询问的不是问题,如果你确实遇到了selected变量的问题,那么原因必须是你没有在代码中向我们透露的其他内容你到目前为止已经展示过了。我们可能需要查看更完整的示例,说明您遇到此问题的位置,甚至是工作页面的链接,以便设置断点并检查事物。

答案 1 :(得分:0)

当你这样做时

var selected = $(this);

selected现在是一个jQuery对象,它是根据您单击的元素构建的(this是您单击的元素的DOM对象;它没有任何jQuery方法; selected < em> 获取jQuery方法。)

$.ajax({
    url: url,
    data: { id: id },
    success: function (data) {
        $(selected).html('Test!');//selected is undefined at this point
当然应该定义

selected,因为它是一个结合到闭包中的外部变量。但是,$(selected)解析为尝试将已经是jQuery对象的内容传递给jQuery构造函数,而jQuery可能会有点困惑,因为jQuery构造函数通常期望看到一个DOM对象(转换为jQuery对象) ,HTML字符串(构建相应的DOM片段并转换为jQuery对象),一个函数(在加载DOM时运行它),或者扩展的CSS选择器(将其转换为表示页面中一个或多个元素的jQuery对象) )。所以$(selected)的结果没有正式定义。

显然,如果这是问题的根源,将代码更改为selected.html(...)至少应该给出不同的结果,并且最好是有效的。         },

答案 2 :(得分:-1)

是的,需要将this存储在变量中。

$('.job-details-apply').live('click', function () {
  var url = $('#apply-job-url').val();
  var id = $(this).attr('value');
  var _this = this;
  $.ajax({
      url: url,
      data: { id: id },
      success: function (data) {
          $(_this).html('Test!');
      },
      error: function () {
      }
  });
  return false;
});