将循环变量调用到自动压缩选择中

Calling loop variable into autocomplate select

本文关键字:动压 压缩 选择 循环 变量 调用      更新时间:2023-09-26
for (a = 1; a <= 2; a++) {
  $("#inp-" + a + "  .nama").autocomplete({
    source: function(request, response) {
      $.ajax({
        url: "states_remote.php",
        dataType: "json",
        data: {
          term: request.term
        },
        success: function(data) {
          response($.map(data, function(item) {
            return {
              value: item.nama,
              pangkat: item.pangkat,
              jabatan: item.jabatan,
              nip: item.nip
            };
          }));
        }
      });
    },
    minLength: 2,
    select: function(event, ui) {
      $("#inp-" + a + " .pangkat").val(ui.item.pangkat);
      $("#inp-" + a + " .nip").val(ui.item.nip);
      $("#inp-" + a + " .jabatan").val(ui.item.jabatan);
      $(this).next('.nama').focus();
    },
    html: true,
    open: function(event, ui) {
      $(".ui-autocomplete").css("z-index", 1000);
    }
  });
}

我想将循环变量a到自动压缩选择函数中,但我无法访问此函数中的调用变量

select: function(event, ui) {
  $("#inp-" + a + " .pangkat").val(ui.item.pangkat);
  $("#inp-" + a + " .nip").val(ui.item.nip);
  $("#inp-" + a + " .jabatan").val(ui.item.jabatan);
  $(this).next('.nama').focus();
},

有人可以帮助我解决问题吗? 我搜索其他主题,也许这个名字是异步函数。

尝试使用闭包:-

for (a = 1; a <= 2; a++) {
  (function(a) {
    $("#inp-" + a + "  .nama").autocomplete({
      source: function(request, response) {
        $.ajax({
          url: "states_remote.php",
          dataType: "json",
          data: {
            term: request.term
          },
          success: function(data) {
            response($.map(data, function(item) {
              return {
                value: item.nama,
                pangkat: item.pangkat,
                jabatan: item.jabatan,
                nip: item.nip
              };
            }));
          }
        });
      },
      minLength: 2,
      select: function(event, ui) {
        $("#inp-" + a + " .pangkat").val(ui.item.pangkat);
        $("#inp-" + a + " .nip").val(ui.item.nip);
        $("#inp-" + a + " .jabatan").val(ui.item.jabatan);
        $(this).next('.nama').focus();
      },
      html: true,
      open: function(event, ui) {
        $(".ui-autocomplete").css("z-index", 1000);
      }
    });
  })(a);
}

还有另一种方法,我觉得那会更好:

$(".nama").autocomplete({ // <----all the ".nama" element will be initialized
  source: function(request, response) {
    $.ajax({
      url: "states_remote.php",
      dataType: "json",
      data: {
        term: request.term
      },
      success: function(data) {
        response($.map(data, function(item) {
          return {
            value: item.nama,
            pangkat: item.pangkat,
            jabatan: item.jabatan,
            nip: item.nip
          };
        }));
      }
    });
  },
  minLength: 2,
  select: function(event, ui) {
    // event.target will be the ".nama" element and 
    // as per your code it seems that the elements are sibling 
    // elements of the ".nama", so use `.end()` to get back to 
    // $(event.target)
    $(event.target).siblings(".pangkat").val(ui.item.pangkat).end()
                   .siblings(".nip").val(ui.item.nip).end()
                   .siblings(".jabatan").val(ui.item.jabatan);
    $(event.target).focus();
  },
  html: true,
  open: function(event, ui) {
    $(".ui-autocomplete").css("z-index", 1000);
  }
});