JavaScript - JSON - LocalStorage

Может ли кто-нибудь сказать мне, почему ничего не выводится на моей странице при попытке запустить этот код?JavaScript - JSON - LocalStorage

Я пытаюсь проанализировать элемент localStorage и создать таблицу для каждого элемента с помощью цикла for. Затем я добавляю общую цену.

Примечание: localStorage содержит 3 изделия и является NOT пустой.

<!DOCTYPE html> 
<html> 
<head> 
    <meta content="text/html;charset=utf-8" http-equiv="Content-Type"> 
    <meta content="utf-8" http-equiv="encoding"> 
    <style>img{ height: 100px; float: left; }</style> 
    <link rel="stylesheet" type="text/css" href="style.css"> 

    <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> 


    <script> 

     function ShoppingCart() { 

      var totalPrice = 0; 
      var output; 

     for (var i = 0; i < localStorage.length; i++){ 

      var product = localStorage.getItem('Product_'+i); 

      var result = JSON.parse(product); 

      var productName; 
      var productAlbum; 
      var productQuantity; 
      var productPrice; 
      var productSubTotal = 0; 
      var totalPrice; 

      productName = result.name 
      productAlbum = result.album; 
      productQuantity = result.quantity; 
      productPrice = parseFloat(result.price); 
      productSubTotal = productQuantity * productPrice; 

      totalPrice = totalPrice + productSubTotal; 


      outputName = "<div id='cart-table'><table><tr><td>NAME:" + productName + "</td></tr></div>" ; 
      outputAlbum = "<tr><td>ALBUM:" + productAlbum + "</td></tr>" ; 
      outputQuantity = "<tr><td>QUANTITY:" + productQuantity + "</td></tr>"; 
      outputPrice = "<tr><td>PRICE:" + productPrice + "</td></tr>"; 
      outputSubTotal = "<tr><td>SUB-TOTAL" + productSubTotal + "</td></tr></table><br><br>"; 




         } 

      var outputTotal = "<table><tr><td>" + totalPrice + "</td></tr></table>"; 
      var TotalOutput = outputName + outputAlbum + outputQuantity + outputPrice + outputSubTotal + outputTotal; 
      document.getElementById("Cart-Contents").innerHTML=TotalOutput 

        alert(TotalOutput); 
     } 

      window.onload = ShoppingCart(); 


    </script> 


</head> 
<body> 
<div id="wrapper"> 

    <header id="header"> 
     <strong><table id="menu"><tr><td>Home</td><td>Contact</td><td>Login</td><td></td><td>Products</td></tr></table></strong> 
    </header> 
    <section id="middle"> 

     <div id="container"> 
      <div id="content"> 
       <a class="" onclick="ShoppingCart()"><span>Cart</span></a> 
       <div id="Cart-Contents"> 


      </div> 


      </div><!-- #content--> 
     </div><!-- #container--> 

     <aside id="sideLeft"> 
      <strong>Left Sidebar:</strong> 
     </aside><!-- #sideLeft --> 

     <aside id="sideRight"> 
      <strong>Right Sidebar:</strong> 
     </aside><!-- #sideRight --> 

    </section><!-- #middle--> 

</div><!-- #wrapper --> 



<footer id="footer"> 
    <strong>by Brian Livori</strong> 
</footer><!-- #footer --> 
</body> 
</html>

источник

2013-04-25 Brian

Вы уверены, что элементы в 'localStorage' начинаются с "Product_"? В зависимости от того, как вы устанавливаете элементы, длина может не иметь длины. В любом случае, вам может понадобиться цикл с циклом 'for in' – Ian

Это просто, просто изменить

window.onload = ShoppingCart();

window.onload = ShoppingCart;

window.onload является функцией обратного вызова ссылки. Когда вы назначаете ShoppingCart(), вы фактически назначаете результат выполнения функции window.onload.

Пример здесь http://jsbin.com/urikub/1/edit

источник

2013-04-25 00:58:22 Vadim

Объясните ** почему **. Для нас может быть очевидным, что происходит, но не с OP. – Ian

@ Vadim Nope, я до сих пор не получаю выход. Страница остается пустой! – Brian

Ах, это сработало, однако имя и альбомы не показываются! Любая помощь ? – Brian

JavaScript - JSON - LocalStorage

ответ

Смежные вопросы