将变量从Ajax传递到Javascript

-1

我知道这个问题已经被问及可能回答了几次，但不是在我需要的确切上下文中，以确保我有充分的理解，我想问我的具体情况。将变量从Ajax传递到Javascript

我需要当一个HTML/Javascript页面加载时，它会触发一个服务器端调用来从数据库中查询一些信息。这些信息应该在服务器端形成一个数组，然后传递给客户端。从客户端，我应该能够遍历数组并将它们推送到客户端数组中（我将循环和推送的原因是因为在这种情况下，我可能需要在字符串被放入数组之前用字符串前缀某些条目）然后显示给用户。

我目前只看到了一个div的目标和替换，但不是一个数组的例子。

我已经尝试了几次不同的代码尝试，但可悲的是没有运气（并且似乎无法完全理解如何在客户端和服务器之间传递值）。我相当熟悉其他语言（C＃，Python），所以当它涉及到这种东西时，我不是一个完整的newby，但这是一个相当新的JavaScript/Ajax风险投资组合。

来源

2016-09-18 Kev

当你在客户端循环数据时 - 为你循环的每个元素创建一个容器/行。在循环结束时，附加到页面上的容器。 – tymeJV

显示您遇到问题的代码。 – trincot

我能想象的唯一答案就是指向教程的指针，它是SO的Off Topic。[一个最小的，完整的和可验证的例子]（http://stackoverflow.com/help/mcve）你尝试过的东西是唯一能够从一个近距离投票候选人中提出这个问题的东西 – RiggsFolly

通常最容易在JavaScript中使用传输数据时，因此json_encode使用JavaScript对象符号（JSON）：

<?php 
//somearray.php 
$arr = ["bar", "baz", "kaz"]; 
header('Content-Type: application/json'); 
echo json_encode($arr);

然后你只需让你AJAX请求使用图书馆或什么的，解码JSON和过程因为如果你在JavaScript创建它的权利有：

<html> 
<body> 
<script> 
var xmlhttp = new XMLHttpRequest(); 
var url = "http://example.com/somearray.php"; 

xmlhttp.onreadystatechange = function() { 
    if (this.readyState == 4 && this.status == 200) { 
     var myArr = JSON.parse(this.responseText); 
     prefix(myArr); 
    } 
}; 
xmlhttp.open("GET", url, true); 
xmlhttp.send(); 

function prefix(arr) { 
    var output = []; 
    var i; 
    for(i = 0; i < arr.length; i++) { 
     output.push('foo ' + arr[i]); 
    } 
    console.log(output); //["foo bar", "foo baz", "foo kaz"] 
} 
</script> 
</body> 
</html>

（从http://www.w3schools.com/json/tryit.asp?filename=tryjson_http修改）

此信息应该在服务器端形成一个数组，然后传递给客户端。从客户端，我应该然后能够遍历数组并把它们推到客户端阵列

这可能有助于更多阅读了关于HTTP，它是如何“无状态”协议，什么一个AJAX请求实际上是在做（提示;它仍然是无状态的），因为它听起来像你不了解服务器/客户端数据存在的位置。

来源

2016-09-18 14:15:21 Pocketsand

好的，这里是一个小例子，你如何做到这一点。当您使用JSON时，它实际上很简单。使用PHP中的json_encode()，您可以轻松地将数组转换为JSON，通过AJAX接收数据并使用每个循环处理数据。

下面是代码，您可以使用testings： HTML：

<!DOCTYPE html> 
<html> 
    <head> 
     <meta charset="UTF-8"> 
     <title>AJAX JSON Example</title> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
     <script> 
      $(function(){ 
       $.getJSON('ajax.php',function(data){ 
        $.each(data,function(index,value){ 
         $('body').append('Name: ' + value.name + ' | City: ' + value.city + '<br />'); 
        }) 
       }); 
      }); 
     </script> 
    </head> 

    <body> 

    </body> 

</html>

PHP：

<? 
// I was too lazy to set up a DB for this example. 
// You should know how to process database data in PHP 
/* 
$sql = "SELECT `id`,`name`,`city` FROM `useres`"; 
$result = $db->query($sql); 
while($array = $db->assoc($result)) 
{ 
    $json['id']['name'] = $array['name']; 
    $json['id']['city'] = $array['city']; 
} 
*/ 

// This part is only the example data which you should have received from the DB 
$json[1]['name'] = 'Test Tester'; 
$json[1]['city'] = 'Test Village'; 

$json[2]['name'] = 'Claud Atlas'; 
$json[2]['city'] = 'Haven'; 

// echo the array as JSON 
echo json_encode($json); 
?>

这里有从上面的代码中的活生生的例子：https://work.walter-it.de/test/ajax/

来源

2016-09-18 14:15:28

将变量从Ajax传递到Javascript

回答

相关问题