Question

感谢您阅读本文。

我想这真的是一个javascript问题，我的标题可能并不是我想要做的事情的核心，但我想将我的ajax请求的结果存储在一个全局变量中。这将允许我在进行ajax调用之前测试var ...并避免重复ajax调用相同的数据。我需要能够将click事件中的变量名称通过populateSelect函数传递到ajaxCall函数。

似乎我可以将函数作为参数传递，但我无法完成这项工作。

我喜欢在我的问题中包含工作示例，但在这种情况下，调用服务器的延迟是问题的一部分。

由于

$('#getSelectOptions').bind("click", function() {
 populateSelect(this);
});

function populateSelect(whatWasClicked) {
 var thisSelect = $(whatWasClicked).parents("div").find("select") ;

 var before = function() { $(loading).show() ;  } ;
 var complete = function() { $(loading).hide() ;  } ;
 var data = {'_service' : 'myService', '_program' : 'myProgram' } ;
 var error = function(){alert("Error"); } ;
 var success = function(request) { $(thisSelect).html(request) ; };
 var waitTime = 20000 ;

 ajaxCall(thisSelect, waitTime, before, complete, data, success, error ) ;
}

function ajaxCall(elementToPopulate, waitTime, whatToDoBeforeAjaxSend,
                  whatToDoAfterAjaxSend, dataToSendToTheServer, 
                  whatToDoAfterSuccess, whatToDoAfterError) {
 $.ajax({   
  type: "post", 
  url: "http://myURL/cgi-bin/broker",   
  dataType: "text", 
  data: dataToSendToTheServer, 
  timeout: waitTime, 
  beforeSend: whatToDoBeforeAjaxSend, 
  error: whatToDoAfterError(request),
  success: whatToDoAfterSuccess(request)
 });
}

编辑继续教育如何撰写一个好问题...我应该提到我调用populateSelect来填充多个选项..所以我需要引用每个选择的结果

Answer 1

在您给出的示例中，您只有一种类型的AJAX请求，POST每次都使用相同的数据编辑到同一个URL。如果是这种情况，你应该只需要：

var brokerResponse = null;  // <-- Global variable

function populateSelect(whatWasClicked) {
 var thisSelect = $(whatWasClicked).parents("div").find("select") ;

 if (!brokerResponse) {  // <-- Does an old response exist? If not, get one...
   var before = function() { $(loading).show() ;  } ;
   var complete = function() { $(loading).hide() ;  } ;
   var data = {'_service' : 'myService', '_program' : 'myProgram' } ;
   var error = function(){alert("Error"); } ;

   var success = function(request) {  // <-- Store the response before use
      brokerResponse = request; 
      $(thisSelect).html(brokerResponse);
   };
   var waitTime = 20000 ;

   ajaxCall(thisSelect, waitTime, before, complete, data, success, error ) ;
 }
 else {   // <-- If it already existed, we get here.
   $(thisSelect).html(brokerResponse);  // <-- Use the old response
 }
}

如果whatWasClicked有多个可能的项目，每个项目需要缓存不同的AJAX响应，那么您需要使用一些字符串来识别whatWasClicked，并使用它来存储多个值全局变量。例如，如果id上有唯一的whatWasClicked，则可以使用：

var brokerResponse = {}; // Global variable is a simple object

function populateSelect(whatWasClicked) {

 var whatWasClickedId = $(whatWasClicked).attr('id'); // Get the unique ID
 var thisSelect = $(whatWasClicked).parents("div").find("select") ;

 if (!brokerResponse[whatWasClickedId]) {  // Check that ID for a response
   var before = function() { $(loading).show() ;  } ;
   var complete = function() { $(loading).hide() ;  } ;
   var data = {'_service' : 'myService', '_program' : 'myProgram' } ;
   var error = function(){alert("Error"); } ;
   var success = function(request) {

      brokerResponse[whatWasClickedId] = request; // Using ID
      $(thisSelect).html(brokerResponse);
   };
   var waitTime = 20000 ;

   ajaxCall(thisSelect, waitTime, before, complete, data, success, error ) ;
 }
 else {
   $(thisSelect).html(brokerResponse[whatWasClickedId]); // Etc...
 }
}

Answer 2

jQuery有一个$ .data方法，可用于存储/检索与页面上任何元素相关的项目。

//e.g. create some object
var inst = {};
inst.name = 'My Name'

var target = $('#textbox1');

//save the data
$.data(target, 'PROP_NAME', inst);

//retrieve the instance
var inst =  $.data(target, 'PROP_NAME');

Answer 3

JavaScript的范围是这样的，如果你刚刚声明了一个全局变量，你应该能够从ajax成功函数和click函数中访问它。

var _global_holder = null;
$('#getSelectOptions').bind("click", function() {
 if(_global_holder==null) { whatever }
 populateSelect(this);
});

function populateSelect(whatWasClicked) {
 if(_global_holder !== null) {
    whatever
  } else { whatever else }

 ajaxCall(thisSelect, waitTime, before, complete, data, success, error ) ;
}

function ajaxCall(elementToPopulate, waitTime, whatToDoBeforeAjaxSend,
                  whatToDoAfterAjaxSend, dataToSendToTheServer, 
                  whatToDoAfterSuccess, whatToDoAfterError) {
...
}

使用jQuery，如何将调用结果存储到$ .ajax函数中，以便重用？

3 个答案: