0

我无法访问从 PHP 脚本获取 JSON 数据的 jquery 数组。如果我在 jquery 中对数组进行硬编码,它就可以正常工作。我使用 cosole.log 进行了检查。nproducts 和 products 数组都给出相同的值。请注意,nproduct 具有硬编码值,其中产品是从 PHP 脚本中获取的。有人可以把我放在正确的方向。谢谢

这是PHP代码

while ($row = oci_fetch_array($result,OCI_ASSOC)) {
    $shop[$row['WH_DESCRIPTION']] = array( 
        'pic' => $row['WH_PIC'],
        'price' => $row['WH_PRICE']
      );
} 

echo json_encode($shop);

这是jQuery。如果我使用 nproduct 那么 productsRendering 函数可以正常工作,但如果我使用 product 那么它会打印 containsValue 的名称和图片,以及 undefined 的价格。似乎产品数组在 productRendering 函数中没有任何值,因为 getJSON 正在返回值。

<script type="text/javascript">
    var cart = (function ($) {

        var productsOffset = 3, products = [], 
            nproducts = {
                'Black T-shirt': {
                    pic: 'black-controller.png',
                    price: 15
                },
                'Green T-shirt': {
                    pic: 'green-kentucky.png',
                    price: 18
                },
                'Brown T-shirt': {
                    pic: 'brown-computer.png',
                    price: 25
                }

            };

         $.getJSON('shop.php', function(data) {
              products = data;
              console.log(data);       //showing values here
              console.log(products);   //showing values here
              console.log(nproducts);  //showing values here
          });

        function render() {
            productsRendering();
        };

        function productsRendering() {
            var catalog = $('#catalog'),
                imageContainer = $('</div>'),
                image, product, left = 0, top = 0, counter = 0;
                console.log(products);   //does not have values here
            for (var name in products) {
                product = products[name];
                image = createProduct(name, product);
                image.appendTo(catalog);
                if (counter !== 0 && counter % 3 === 0) {
                    top += 147; // image.outerHeight() + productsOffset;
                    left = 0;
                }
                image.css({
                    left: left,
                    top: top
                });
                left += 127; // image.outerWidth() + productsOffset;
                counter += 1;
            }
            $('.draggable-demo-product').jqxDragDrop({ dropTarget: $('#cart'), revert: true });
        };

        function createProduct(name, product) {
            return $('<div class="draggable-demo-product jqx-rc-all">' +
                    '<div class="jqx-rc-t draggable-demo-product-header jqx-widget-header-' + theme + ' jqx-fill-state-normal-' + theme + '">' +
                    '<div class="draggable-demo-product-header-label"> ' + name + '</div></div>' +
                    '<div class="jqx-fill-state-normal-' + theme + ' draggable-demo-product-price">Price: <strong>$' + product.price + '</strong></div>' +
                    '<img src="images/t-shirts/' + product.pic + '" alt='
                    + name + '" class="jqx-rc-b" />' +
                    '</div>');
        };

        function init() {
            render();
        };

        return {
            init: init
        }
    } ($));

    $(document).ready(function () {
        cart.init();
    });
</script>
4

2 回答 2

1

productsRendering()在 ajax 请求完成之前被调用。考虑productsRendering()在 ajax 回调中调用。

于 2013-04-03T17:48:54.860 回答
0

这是因为浏览器不会将响应正文解释为 JSON。在回显响应之前尝试在 php 中设置 Content-Type 标头:

header('Content-Type', 'application/json');
于 2013-04-03T17:48:23.513 回答