Question

当我选择人员时，我有一个包含人员名称的下拉列表，它显示有关人员的信息。我需要在代码中添加一条语句，这样不会使我已经选择的人员浪费更多时间，这是我的代码：

$(function() {
  var ids = [{{personel.pk}}]
  $(".pers").click(function() {
    pk = this.getAttribute('data-pk');
    url = '/post/' + pk + '/personel_ajax/';
    resp = '<div class="row">';
    resp += $.ajax({
      dataType: "json",
      url: url,
      success: function(data) {
        console.log('success', data);
        console.log(data);
        $('#container').append(
          '<div class="col-sm-4">' +
          '  <div class="thumbnail">' +
          '    <div class="caption">' +
          '      <h3>' + data[0]['fields']['name'] + ' <small>{{post.date}}</small></h3>' +
          '      <p>' + data[0]['fields']['title'] + '</p>' +
          '      <p>' + data[0]['fields']['title2'] + '</p>' +
          '      <p><a href="/post/' + data[0]['pk'] + '/" class="btn btn-primary btn-sm" role="button">Task Description</a>' +
          '        <a href="/post/'+data[0]['pk'] + '/update" class="btn btn-success btn-sm" role="button">Update Task</a>' +
          '        <a href="/post/'+data[0]['pk'] + '/delete" class="btn btn-danger btn-sm" role="button">Delete Task</a></p>' +
          '    </div>' +
          '  </div>' +
          '</div>'
        );
      }
    });
  });
});

Answer 1

您可以将简单数组用作简单缓存；

$(function() {
  var ids = [1, 2, 3, 4];
  var dataCache = [];
  var pk;
  function render(data) {
    $("#container").append(
      '<div class="col-sm-4">' +
        '<div class="thumbnail">' +
        '<div class="caption">' +
        "<h3>" +
        data[0].fields.name +
        " <small>{{post.date}}</small></h3>" +
        "<p>" +
        data[0].fields.title +
        "</p>" +
        "<p>" +
        data[0].fields.title2 +
        "</p>" +
        '<p><a href="/post/' +
        data[0].pk +
        '/" class="btn btn-primary btn-sm" role="button">Task Description</a>' +
        '<a href="/post/' +
        data[0].pk +
        '/update" class="btn btn-success btn-sm" role="button">Update Task</a>' +
        '<a href="/post/' +
        data[0].pk +
        '/delete" class="btn btn-danger btn-sm" role="button">Delete Task</a></p>' +
        "</div>" +
        "</div>"
    );
  }

  $(".pers").click(function() {
    pk = this.getAttribute("data-pk");
    url = "/post/" + pk + "/personel_ajax/";
    resp = '<div class="row">';
    if (dataCache[pk]) {
      render(dataCache[pk]);
      return;
    }
    $.ajax({
      dataType: "json",
      url: url,
      success: function(data) {
        console.log("success", data);
        console.log(data);
        dataCache[pk] = data;
        render(data);
      }
    });
  });
});

使用jQuery if语句控制下拉列表项

1 个答案: