仅使用HTML / JavaScript创建购物车 [英] Creating a Shopping Cart using only HTML/JavaScript

问题描述

我不确定要完成这个项目该怎么做。我需要创建一个仅使用一个HTML页面的购物车。我设置了表格，显示出售的是什么，但丢失的是JavaScript。

我不知道如何链接添加到购物车按钮与所有必要的数据（名称，说明和价格）能够将其添加到购物车。我不需要将它从购物车中移除，但它确实需要显示总计。在网上搜索一些答案之后，我尝试了一些东西，但无法弄清楚。

任何帮助都是绝对值得赞赏的，因为我在这一点上完全失去了知识，而且通常都是JavaScript。

这是jsFiddle，但对我来说有点令人困惑，因为它的工作方式与我在记事本++中运行时不同。

jsFiddle： http://jsfiddle.net/renavi/ATjvt/5/

 函数AddtoCart（）{
 console.log（'hi'）; 
 var x = document.getElementById（'Items'）; 
 var new_row = x.rows [1] .cloneNode（true）; 
 var len = x.rows.length; 
 new_row.cells [0] .innerHTML = len; 
 var inp1 = new_row.cells [1] .getElementsByTagName（'input'）[0]; 
 inp1.id + = len; 
 inp1.value =''; 
 var inp2 = new_row.cells [2] .getElementsByTagName（'input'）[0]; 
 inp2.id + = len; 
 inp2.value =''; 
 x.appendChild（new_row）; 
} 
  

直接文件在这里

Pastebin： http://pastebin.com/sutGWjSY

simpleCart

这是一个免费的开源javascript 购物车，可以轻松地与您当前的网站进行整合。

您将在 github 上获得完整的源代码。

I'm not sure what to do in order to complete this project. I need to create a shopping cart that uses only one HTML page. I have the table set up showing what is being sold but where I am lost is the JavaScript.

I don't know how to link the "Add to Cart" button with all the necessary data( The name, description, and price) to be able to add it to the cart. I don't need to be able to remove it from the cart, but it does need to show the total. After searching online for a few answers, I've tried some things but just cannot figure it out.

Any help is definitely appreciated because I am completely lost at this point and am new to JavaScript in general.

This is the jsFiddle but that was a little confusing to me, because it's working differently on there than if I just went to Run in Notepad++

jsFiddle: http://jsfiddle.net/renavi/ATjvt/5/

function AddtoCart() {
  console.log('hi');
  var x = document.getElementById('Items');
  var new_row = x.rows[1].cloneNode(true);
  var len = x.rows.length;
  new_row.cells[0].innerHTML = len;
  var inp1 = new_row.cells[1].getElementsByTagName('input')[0];
  inp1.id += len;
  inp1.value = '';
  var inp2 = new_row.cells[2].getElementsByTagName('input')[0];
  inp2.id += len;
  inp2.value = '';
  x.appendChild(new_row);
}

The direct file is here

Pastebin: http://pastebin.com/sutGWjSY

解决方案

You simply need to use simpleCart

It is a free and open-source javascript shopping cart that easily integrates with your current website.

You will get the full source code at github

这篇关于仅使用HTML / JavaScript创建购物车的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！