Question

我的目标是用Javascript创建一个函数，该函数将返回XHTMLRequeest对象的结果，并使用该结果设置div的内容。

创建onClick事件
触发OnClick时-调用带有参数的GetDates函数，该参数将返回值列表
在函数GetDates中-创建一个XhtmlRequest来触发PhP脚本，该脚本返回一个JSON字符串，然后我们将其解析并格式化为字符串以传递回调用函数
使用从GetDates返回的格式化字符串设置页面的一部分（基本上使用该字符串创建菜单）

现在，无需使用函数就可以达到相同的结果，但是，一旦我尝试使用函数并将值传递给这些函数，我只会获得默认值-而且我认为问题可能出在XHTMLRequest对象的异步性质上返回结果。

这是我的代码。

<html>
<head>
    <title>Php / Json Test</title>

</head>
<body>

    <button id = "button"> Get Text File </button>
    <div id ="device_id" >
        ALAN
    </div>
    <div id = "result" ></div>

    <script>
    document.getElementById('button').addEventListener('click',SetDates);

    function SetDates(){
        var ThisDevice = '';
        ThisDevice = document.getElementById('device_id').innerHTML;
        document.getElementById('result').innerHTML = GetDates(ThisDevice); 
    }

function GetDates(device){
var xhr = new XMLHttpRequest();
var output = 'not set';

if (device == 'NA') {
alert('Please select a valid device ID');
return 'Error';

}

var url = 'get_dev_dates.php?deviceid=' +device;
xhr.open('GET', url,true);

    xhr.onload = function (output)
{

if (this.status == 200){

Phpresponse = JSON.parse(this.responseText);

output = '';

output += '<ul>'
    for (var i in Phpresponse){
    output += '<li> Date : ' + Phpresponse[i].DATE_PART + '</li>';
    }
    output += '</ul>';

}
else {
console.log(xhr.status)
    output = 'Error X'
}
} // xhr Load function
xhr.send();

// document.getElementById('result').innerHTML = res;
return output;
}// GetDates

    </script>

</body>
</html>

我对Java脚本很陌生，因此很难掌握执行的“流程”，但是我认为它的内联函数“ xhr.Open”存在问题是正确的吗？就像功能中的功能一样！我尝试调用“ xhr.Open”将“异步”选项设置为“ false”，但是只是从浏览器（控制台）收到警告，结果是相同的。

基本上，它不等待内联函数“ onLoad”启动，而我只是收到最初指定的默认值。

总而言之。有没有一种方法可以包装对XMLHttpRequest的调用并从函数中获取结果-或者我是否必须将所有代码都放在文档主体中并运行它？我试图通过使用函数使代码更具模块化和可读性：）

任何帮助将不胜感激。谢谢

XHTmlRequest请求的问题性质？

0 个答案: