在 PHP 循环中动态创建 jQuery 列表视图答案

【问题标题】：Dynamically creating jQuery listview in PHP loop在 PHP 循环中动态创建 jQuery 列表视图
【发布时间】：2014-01-03 18:55:47
【问题描述】：

我想在 PHP 循环中填充 jQuery 列表视图，我尝试通过回显使用 PHP 变量填充列表的 javascript 代码来实现。这就是我正在使用的：

我的 HTML

<div data-role='page' id='feedPage'>
     <div data-role='content'>
        <ul id='pics' data-role='listview'>
        <li>test</li>
        </ul>
     </div>
</div>

还有我的 PHP/JavaScript

echo "<script type='javascript'>
var pics = \$('#pics')
var pitem = \$('<li/>').html($myArray[element])
var plink = \$('<a/>')
pitem.append(plink)
pics.append(pitem)
pics.listview('refresh')
</script>";

但列表出现空白。此代码在 PHP for 循环内运行，我能够在 PHP 中访问和操作 $myArray 的所有元素，但我似乎无法填充列表。我什至尝试使用简单的.html('hello') 运行此代码，但无济于事。我得到的只是一个空白列表，除了我在 HTML 中硬编码的 test 项目。有没有办法像这样在 PHP 中生成一个列表，如果是这样，我该如何正确地做到这一点？

谢谢！

解决方案：

我只是通过 <script type='text/javascript'> 和 .html('$myArray[element]') 来完成这项工作（注意单引号）。这是因为 javascript 在 PHP 回显中运行。哦，我的 $ 都不需要转义。最终代码：

echo "<script type='text/javascript'>
var pics = $('#pics')
var pitem = $('<li/>').html('$myArray[element]')
var plink = $('<a/>')
pitem.append(plink)
pics.append(pitem)
pics.listview('refresh')
</script>";

【问题讨论】：

这是个坏主意。对于这种情况，您必须使用 js 文件

标签： javascript php jquery html jquery-ui

【解决方案1】：

我认为主要问题在type='javascript'，应该是type='text/javascript'。

要考虑的另一件事是$myArray[element] 的内容需要打印为javascript 字符串。运行 $myArray = array_map('json_encode', $myArray); 应该可以解决问题。

【讨论】：

type='text/javascript' 让它为我工作！对于 PHP 变量，我不需要做任何特别的事情。我将我的解决方案添加到了 OP。

【解决方案2】：

您忘记将您的 JS 代码放入 document.ready 事件回调中

$(document).ready(function($){
  var pics = $('#pics')
  var pitem = $('<li/>').html($myArray[element])
  var plink = $('<a/>')
  pitem.append(plink)
  pics.append(pitem)
  pics.listview('refresh')
});

【讨论】：