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

问题描述

我不知道该怎么做才能完成这个项目.我需要创建一个仅使用一个 HTML 页面的购物车.我已经设置好表格，显示正在出售的内容，但我丢失的地方是 JavaScript.

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.

绝对感谢任何帮助，因为此时我完全迷失了方向，并且总体上是 JavaScript 的新手.

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

这是 jsFiddle 但这让我有点困惑，因为它在那里的工作方式与我在 Notepad++ 中运行时不同

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);
}

直接文件在这里

Pastebin:http://pastebin.com/sutGWjSY

推荐答案

你只需要使用 simpleCart

它是一个免费的开源 javascript 购物车，可轻松与您当前的网站集成.

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

您将在 github

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