如何执行这个数组（jQuery Ajax）？答案

【问题标题】：How to execute this array (jQuery Ajax)?如何执行这个数组（jQuery Ajax）？
【发布时间】：2023-03-17 14:38:01
【问题描述】：

我有一个 PHP 脚本，它返回一个包含 4 条记录的对象：

$obj = array(
    'id'=>$id,
    'idCliente'=>$idCliente,
    'arquivo'=>$arquivo,
    'titulo'=>$titulo,
    'descricao'=>$descricao,
    'data' => $datacadastro
    );

我需要在 HTML 中一一显示记录。我是 jQuery 新手，我正在尝试编写这段代码 3 天，所以我决定问一下。

<div>
    ID:
    IDCliente:
    Arquivo:
    Titulo:
    Descricao:
    Data:
</div>
<div>
    ID:
    IDCliente:
    Arquivo:
    Titulo:
    Descricao:
    Data:
</div>
<div>
    ID:
    IDCliente:
    Arquivo:
    Titulo:
    Descricao:
    Data:
</div>
<div>
    ID:
    IDCliente:
    Arquivo:
    Titulo:
    Descricao:
    Data:
</div>

如何进行？我有：

$.ajax ({   type: "POST", 
    dataType : "json",
    cache: false,
    url: "<?php bloginfo('template_url'); ?>/scripts/php_functions.php",
    data: {idClienteDocumentos: idClienteDocumentos, ajax: "true"},
    success: function(result){

我有这段代码，但它不起作用。

var campos = ['arquivo', 'idCliente', 'titulo', 'descricao', 'arquivo', 'data'];
var tabela = $('<div id="tabela"></div>');
resultado.forEach(function (linha) {
    var linhaDiv = $('<div></div>');
    linha.forEach(function (campo, index) {
        $('<div></div>').addClass(campos[index]).text(campo).appendTo(linhaDiv);
    });
    linhaDiv.appendTo(tabela);
});

【问题讨论】：

您可以使用.append 等方法将HTML 添加到DOM。您还可以使用< 语法在jquery 中创建DOM 元素，例如$("<div>")
您的意思是您正在寻找一种将 PHP 数组转换为 JavaScript 对象表示法（或 JSON）的方法？像json_encode 这样的函数会很方便......
你能告诉我它是怎么做的吗？感谢您的帮助，如果我的英语不够专业，我们深表歉意。
您的 AJAX 调用是否返回了正确的 JSON，并且您想知道如何创建 HTML？或者您甚至没有弄清楚如何从 PHP 发回 JSON？
只想说，作为一个新用户 +1 不仅仅是写另一个“我如何编码”问题并实际发布您的源代码。

标签： javascript php jquery mysql ajax

【解决方案1】：

您的 PHP 脚本可能是：

$obj = array(
    'id'=>$id,
    'idCliente'=>$idCliente,
    'arquivo'=>$arquivo,
    'titulo'=>$titulo,
    'descricao'=>$descricao,
    'data' => $datacadastro
    );
$result = array('results' => $obj);
echo json_encode($result); die;

你的 jQuery 可能是：

$.ajax ({   type: "POST", 
    dataType : "json",
    cache: false,
    url: "<?php bloginfo('template_url'); ?>/scripts/php_functions.php",
    data: {idClienteDocumentos: idClienteDocumentos, ajax: "true"},
    success: function(response){
      console.log(response.results.id)
      $("#main_div").append(response.results.id);
    }
});

这只是一个示例脚本，您可以根据需要进行修改。

如果你有多维数组，那么你可以通过循环遍历每个记录，如下所示：

PHP 代码：

$obj[0] = array(
    'id'=>$id,
    'idCliente'=>$idCliente,
    'arquivo'=>$arquivo,
    'titulo'=>$titulo,
    'descricao'=>$descricao,
    'data' => $datacadastro
    );
$obj[1] = array(
    'id'=>$id,
    'idCliente'=>$idCliente,
    'arquivo'=>$arquivo,
    'titulo'=>$titulo,
    'descricao'=>$descricao,
    'data' => $datacadastro
    );
$result = array('results' => $obj);
echo json_encode($result); die;

jquery：

$.ajax ({   type: "POST", 
        dataType : "json",
        cache: false,
        url: "<?php bloginfo('template_url'); ?>/scripts/php_functions.php",
        data: {idClienteDocumentos: idClienteDocumentos, ajax: "true"},
        success: function(response){
          $.each(response.results, function(i, item) {
           console.log(item.id);
           //You can append data to HTML div
           $("#main_div").append(item.id);
          });
        }
    });

【讨论】：

感谢您的帮助。你没有忘记循环吗？在控制台中只出现第一个数组对象。很感谢。这是我的问题，循环。
WINNNNNNN ...我在运行您的脚本时遇到了一些困难，因为它缺少 php "while" 来动态获取项目。我研究了代码并稍微实现了你的脚本，最终在你 96% 的脚本的帮助下得到了解决。恭喜你，谢谢。

【解决方案2】：

您尝试过的代码存在两个主要问题。首先，linha.forEach。 linha 是一个对象，但 forEach 迭代数组。您希望 for...in 迭代对象。

其次，您永远不会将tabela 添加到您的文档中。因此，即使其他一切都运行良好（几乎是这样），您也永远不会看到结果。

var campos = ['arquivo', 'idCliente', 'titulo', 'descricao', 'arquivo', 'data'];
var tabela = $('<div id="tabela"></div>');
resultado.forEach(function (linha) {console.log(linha);
var linhaDiv = $('<div></div>');

for(var prop in linha)
{
    $('<div></div>').addClass(''+prop+'').text(prop+': '+linha[prop]).appendTo(linhaDiv);
}

linhaDiv.appendTo(tabela);
tabela.appendTo('html');

DEMO

现在，唯一的问题是它没有像您在示例中那样大写标签文本。如果你愿意，我会做的有点不同......

var tabela = $('<div id="tabela"></div>');
$.each(resultado, function(){console.log(this);
    $(tabela).append("<div>ID:"+this.id+"<br/>IDCliente:"+this.idCliente+"<br/>Arquivo:"+this.arquivo+"<br/>Titulo:"+this.titulo+"<br/>Descricao:"+this.descricao+"<br/>Data:"+this.data+"<br/></div>"); 
});
tabela.appendTo('html');

DEMO

我要说的最后一件事是你有success: function(result){，然后是resultado.forEach。您应该在两个地方都有result，或者在两个地方都有resultado。

【讨论】：