JQuery JSON ajax结果存储供以后使用

时间:2015-10-21 01:15:43

标签: jquery ajax

伙计我需要帮助才能使这项工作成功。基本上我正在尝试从PHP ajax调用生成按需选择选项,但我不想在每个请求上生成ajax以生成select选项。

我希望将结果存储在变量中,并在我想生成选择选项时使用它。

这是ajax调用结果的示例。

{"status":"success",
 "tp":0,
 "msg":"Data fetched successfully.",
 "result":{
     "1":"response 1",
     "2":"response 2",
     "3":"response 3"}
}

这是我的简化代码:

$(function () {

    var certList = getList('/ajaxx/ajax.getCertList.php');

    //rest of stuff here

}

function generateCertOptions(elem) {
    var data = certList;

    function generateOptions(data){

        console.log(data.tp); ]] //tried with certList and getting undefined here
        console.log(certList.tp); ]] //tried with data still getting undefined here

        if (data.tp == 0) {
            $.each(data['result'], function(index, value) {
                $(elem).append(new Option(value, index));
            })
        }
    }

    generateOptions(data);
};

2 个答案:

答案 0 :(得分:0)

您的主要问题是$(function () { });创建了自己的变量范围。这意味着在其中定义的任何变量只能由其中的函数访问。

因此,在generateCertOptions()内,certList实际上是undefined

相反,您需要在全局范围内定义变量,然后在您的on load函数中设置变量,如下所示:



var data; // global to store data needs to be OUTSIDE the "$(function () { });" 
$(function () {
    data = getList('/ajaxx/ajax.getCertList.php'); // don't use "var" here so it will use the global variable 
    $('#select1').html(generateCertOptions('#select1'));
    //rest of stuff here
    //...
    
    // later, use the cached value again
    $('#select2').html(generateCertOptions('#select2'));
  
});
function generateCertOptions(elem) {
    $.each(data['result'], function(index, value) {
         $(elem).append(new Option(value, index));
    })
};


// fake the ajax for this example
function getList(url){
  return {"status":"success",
           "tp":0,
           "msg":"Data fetched successfully.",
           "result":{
               "1":"response 1",
               "2":"response 2",
               "3":"response 3"}
          };
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="" id="select1"></select>
<br>
<br>
<br>
<select name="" id="select2"></select>
&#13;
&#13;
&#13;

此外,你需要摆脱我在上面做过的那个嵌套函数。

答案 1 :(得分:0)

首先读取函数generateCertOptions(),然后读取jQuery的函数。

由于您使用匿名函数包装了certList变量,因此您无法再在其他任何地方访问它,这就是您获得未定义结果的原因。此外,如评论中所述,您的结构不正确。你有一个功能无缘无故地包装一个函数。

var certList = null;
$(function() { certList = getList('/ajaxx/ajax.getCertList.php'); }
function generateOptions(data) { ... }
generateOptions(certList); // pass the data

这是一个如何处理它的简单解释。我没有测试这段代码。