当返回的数据有 HTML 标签时，JSON 搞砸了

Question

我有一个返回 JSON 对象的 PHP 页面，如下所示：

  header('Content-Type:application/json');
  echo <<<HERE_DOC
      [ {content: '{row2[contentFull]}', bigimages: '{$row3['catalogFileID']}'}]
      HERE_DOC;

在我的主页中，我有以下 jQuery 代码：

jQuery(function()
{
  jQuery("select#rooms").change(function()
  {
    var options = '';

    jQuery.getJSON("/admin/selection_about.php",{id:jQuery(this).val(), 
                   ajax:isAjax}, function(j)
    {
       for (var i = 0; i < j.length; i++) 
       {
          options = j[i].topImage;
          document.getElementById('content1').value = j[i].bigimages;
       }
    })
  })
})

所以基本上在我的主页中，我有一个下拉菜单。当一个选项被选中时，它会触发一个 Ajax 请求返回给服务器。我以 JSON 格式获取数据，然后基于该 JSON 对象更新 ID 为“content1”的文本区域。

JSON 对象如下所示：

[ 
  {  
     content: '<SPAN STYLE= "" >&quot;
     this is some text&quot; 
     blah blah, &quot;
     some more `text&quot;  
     now some linebreaks; 
     <BR><BR>some more text and then another` linebreak.`<BR>`</SPAN>',
     bigimages: 'cfil1069'
   }
]`

但是这里发生了错误，我的 textarea 没有得到更新。但是，如果我硬编码要在 JSON 对象中返回的纯简单文本，那么我的 textarea 就会更新。

是否存在 JSON 对象中的数据不应具有 HTML 标记的条件？

编辑：

按照建议，我将代码更改为以下 PHP 代码：

$arr = array ('content'=>$rest1,'bigimages'=>$row3['catalogFileID']);
echo json_encode($arr);

但是现在在我的 jQuery 代码中：

j 的长度是'未定义' ...

    jQuery.getJSON("/admin/selection_about.php",{id: jQuery(this).val(), 
                   ajax: isAjax}, function(j)
    {
       alert('here3: ' + j.length); // this shows undefined

       for (var i = 0; i < j.length; i++) 
       {
          document.getElementById('content1').value = j[i].content;
       }
    })

Answer 1

将您的内容放入 PHP 数组中。然后使用 json_encode() 将其转换为 JSON。
这将安全地编码和转义字符，例如 HTML 属性中的双引号。

更新：

j.length不起作用的原因是：
带有键的 PHP 数组不是 Javascript 数组。 Javascript 数组没有键。因此，在转换时，PHP 数组被转换为 JS 对象。

您可以使用j.content 而不是访问您的JS 对象，而不是使用j.length 循环访问对象。 j.length 未定义，因为对象 j 中没有属性名称为 length 的属性（这是因为在您的 PHP 数组中，没有 $arr['length']）