Jquery/ Javascript 从 PHP scope 问题获取信息？

Question

我试图从我们的数据库中获取一些信息，然后在 javascript/JQuery 中使用它，我想我可能对编码的 scope 做错了什么。

这是我的 phtml 页面上的当前代码段（magento）

<script type="text/javascript">
<?php
echo 'var $image-paths = new Array();';
for ($i = 0; $i < count ($_child_products); $i++)
{
    echo '$image-paths[';
    echo $i;
    echo '] = ';
    echo $this->helper('catalog/image')->init($_child_products[$i], 'image');
    echo ';';
}
?>
document.getElementById('main-image').href = $image-paths[1];
</script>

底部的 getElementById 只是为了测试它是否真的抓住了那个图像路径。 到目前为止，php 的东西正在工作并回显正确的链接。 然而，仅仅回应它们是不够的； 它实际上是否将其注册到 javascript 代码中？

这是我的源代码在我的服务器上的样子：

<script type="text/javascript">
var $image-paths = new Array();
$image-paths[0] = http://staging.greencupboards.com/media/catalog/product/cache/1/image/9df78eab33525d08d6e5f  b8d27136e95/feeds/MrsMeyers/MRM-64565-a.jpg;
$image-paths[1] = http://staging.greencupboards.com/media/catalog/product/cache/1/image/9df78eab33525d08d6e5fb8d27136e95/feeds/MrsMeyers/MRM-64566-a.jpg;
$image-paths[2] = http://staging.greencupboards.com/media/catalog/product/cache/1/image/9df78eab33525d08d6e5fb8d27136e95/feeds/MrsMeyers/MRM-64568-a.jpg;
$image-paths[3] = http://staging.greencupboards.com/media/catalog/product/cache/1/image/9df78eab33525d08d6e5fb8d27136e95/feeds/MrsMeyers/MRM-D43114-a.jpg;
document.getElementById('main-image').href = $image-paths[1];
</script>

但是图像链接不会更改为图像路径[1]。 有任何想法吗？

提前致谢！

Answer 1

$image-paths[0] = http://staging.greencupboards.com/media/catalog/product/cache/1/image/9df78eab33525d08d6e5f  b8d27136e95/feeds/MrsMeyers/MRM-64565-a.jpg;
                  ^-- no quote here, or at the end of the string

您正在生产无效的 javascript。 弹出您的 javascript 控制台（chrome/firefox 中的 shift-ctrl-J），您会看到错误。

动态生成 javascript 是有问题的。 任何时候你从 PHP 变量/函数中插入一些东西，你应该通过 json_encode() 运行它，这保证你得到有效的 javascript：

echo json_encode($this->helper('catalog/image')->init($_child_products[$i], 'image'));

或者更好的是，将代码更改为：

$links = array();
for ($i = 0; $i < count ($_child_products); $i++)
    $links[] = $this->helper('catalog/image')->init($_child_products[$i], 'image');
}

echo '$image-paths = ', json_encode($links);

Answer 2

<script type="text/javascript">
<?php
echo 'var $image_paths = new Array();';
for ($i = 0; $i < count ($_child_products); $i++)
{
    echo '$image_paths[';
    echo $i;
    echo '] = "'; // Here the starting of quotes.
    echo $this->helper('catalog/image')->init($_child_products[$i], 'image');
    echo '";'; // Here the ending of quotes.
}
?>
document.getElementById('main-image').href = $image_paths[1];
</script>

现在应该可以了。 希望能帮助到你。