0

团队，我希望浏览器从服务器读取属性文件。所以我正在关注 Jquery/AJaX，如下所示。

<script>
var properties = null;
$(document).ready(function(){
    $.ajax({url:"demo_test.txt",success:function(result){
    properties = result;
    //properties = $('#result').val()
    //jQuery.globalEval("var newVar = result;")
    document.write("inside " + properties);
}});
});
document.write("outside " + properties );
</script>

这里“内部”正确打印文件字符。但是“外部”正在为属性打印 null。

  1. 为什么？
  2. 我可以在页面上看到“外部”输出；只有当我评论“内部”行？为什么这样？
  3. 如何获取 jquery 结果以对数据进行进一步处理？
  4. 我可以在服务器中有一个属性文件（key=value）吗？jquery/ajax 是否提供类似于 java.util.property :: getValue("key") 的任何工具？如果上述情况不可行；我可以将属性文件保存为 JSON 或 XML 文件以及 Ajax 提供的任何实用程序来获取密钥的值吗？

更新：

我已经进行了一些研究并更新了第四季度的答案。
我不确定如何读取属性文件，但我给出了 xml/json 文件读取的解决方案。

在更改同步 Ajax 调用后，如下所示

var properties = null;
   $.ajax({
   url : "demo_test.txt",
   async : false,
   success : function(result)
   {
       properties = result;
       document.write("inside " + properties);
    }
});

如果服务器端有一个xml文件，下面是解析的方式：

 <?xml version="1.0"?>
 <server>
    <name>velu</name>
 </server> 

if (window.DOMParser)
{
    parser=new DOMParser();
    xmlDoc=parser.parseFromString(property,"text/xml");
}
else // Internet Explorer
{
    xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
    xmlDoc.async=false;
    xmlDoc.loadXML(property); 
} 
alert(xmlDoc.getElementsByTagName("name")[0].childNodes[0].nodeValue);


如果您在服务器端有 json 内容，那么

{
"name":velu
}

var obj = JSON.parse(property);
alert(obj.name);



用于访问文件的 Javascript 样式（异步） 

var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{// listener
    if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    property = xmlhttp.responseText;
    }
}
xmlhttp.open("GET","demo_test.txt",true);
xmlhttp.send();
while (property != null) {
    alert(property); 
    break;
}
4

1 回答 1

4

您正在使用以所谓的异步方式运行的两个 Javascript 功能：onready 和 AJAX。这意味着您设置了它们，设置后的其余代码将继续运行，直到满足触发事件的必要条件。单个请求可能需要很长时间才能完成，足以在发出返回之前运行数千行或更多代码。

所以这就是你的脚本中发生的事情：

第一行被调用并完成，

var properties = null;

接下来，您告诉您的文档在准备好并完全加载时执行一些代码：

$(document).ready(function(){...});

您的文档还没有准备好（我们仍然处于立即运行代码的领域）所以下一行执行，

document.write("outside " + properties );

properties仍然为空（.ready()尚未调用函数内部的代码）。

一段时间后，文档准备就绪并调用了提供的函数，

function(){
    $.ajax({url:"demo_test.txt",success:function(result){
    properties = result;

    document.write("inside " + properties);
}});

在这个函数中，你设置了一个 AJAX 请求，它在完成时运行一个函数，

$.ajax({url:"demo_test.txt",success:function(result){...}});

此请求也是异步的，因此您的其余代码将在此请求被处理并从服务器返回时输出。但是，在此之后您的程序没有其他功能行，因此稍后某个时候，该函数将成为下一个调用的对象。

    properties = result;

    document.write("inside " + properties);

（为了便于阅读，我删除了评论）

properties设置为result然后打印为非空值。这也解释了为什么您可能首先看到“外部”写入，然后显示“内部”写入，尽管它看起来应该是“内部”。

处理这种情况的最佳方法是在返回的 AJAX 请求中继续所有代码，或者让请求调用另一个函数来继续您的代码。这样你就会知道请求已经处理并且可以安全地继续：

var properties = null;
$.ajax({
    url : "demo_test.txt",
    success : function(result)
    {
        properties = result;
        document.write("inside " + properties);
        runTheRestOfMyCode();
    }
});

function runTheRestOfMyCode()
{
    document.write("outside " + properties );
}

或者，您可以将AJAX 请求中的jQueryasync设置设置为false. 这将阻止您的代码进入下一行，直到发出请求并返回，但它会在等待时暂停所有内容。

var properties = null;
$.ajax({
    url : "demo_test.txt",
    async : false,
    success : function(result)
    {
        properties = result;
        document.write("inside " + properties);
        runTheRestOfMyCode();
    }
});

document.write("outside " + properties );
于 2013-05-23T14:58:38.967 回答