0

所以,首先,感谢一个叫 Marcel Gwerder 的人,他写了我要问的问题的代码。我会写评论或私信他,但我觉得帖子已经死了(人们不只是看旧帖子对吗?他们也不能被撞)而且我不知道如何 PM People。

看看这段代码

// Shop Stuff
var cart = [];

$(document).ready(function(){  
    var buttonTxt = '';

    $(".buyinfo").click(function() {
        //Store text and id of the selected element
        var txt = $(this).siblings('.shopitemname').text(); 
        var id = $(this).closest('.shopitem').attr('id');

        if(!$(this).hasClass('added')) {
           buttonTxt =  $('.buyinfoname', this).text();
           $('#box_item').text(txt);
           cart[id] = txt;            
           //Change text
           $('.buyinfoname', this).text('Added to cart - Click to remove');
           $(this).addClass('added');
           //Show and hide overlay
           $('#confirmbox').show('normal').delay(2000).fadeOut();
        } else {
           delete(cart[id]);
           $(this).removeClass('added');
           $('.buyinfoname', this).text(buttonTxt);
        }

        console.log(cart);
        alert(cart);
    });
}); 

这是一些Javascript。

现在来看看评论者推荐的一些 HTML。

<div id="shop">
<a href="checkout.php"><input type="button" value="Go To Checkout" id="checkoutbutton" /></a>

<div class="shopitem">

<p class="shopitemname">Orange Background Color</p>

<div class="buyinfo">

<p class="buyinfoname">Buy - 40 Coins</p>

</div>

</div>

<div class="shopitem">

<p class="shopitemname">Black Background Color</p>

<div class="buyinfo">

<p class="buyinfoname">Buy - 40 Coins</p>

</div>

</div>

<div class="shopitem">

<p class="shopitemname">Green Background Color</p>

<div class="buyinfo">

<p class="buyinfoname">Buy - 40 Coins</p>

</div>

</div>

<div class="shopitem">

<p class="shopitemname">Blue Background Color</p>

<div class="buyinfo">

<p class="buyinfoname">Buy - 40 Coins</p>

</div>

</div>

<div class="shopitem">

<p class="shopitemname">Yellow Background Color</p>

<div class="buyinfo">

<p class="buyinfoname">Buy - 40 Coins</p>

</div>

</div>

<div class="shopitem">

<p class="shopitemname">Purple Background Color</p>

<div class="buyinfo">

<p class="buyinfoname">Buy - 40 Coins</p>

</div>

</div>

</div>

</section>

<div id="confirmbox">

<p>The item was successfully added to your cart</p>

</div>

我想知道如何将 CART 变量中的值发送到有人可以单击的新页面,称为“checkout.php”。我在想来自 jquery 的 AJAX 或来自 PHP 的帖子,但两者对我来说都很难(我是一个菜鸟编码器),我不想在最终可能无法解决的事情上努力工作。

另外,Marcel 的问题(如果他看到的话)或任何了解他的代码的人的问题:

为什么值没有进入购物车,我做了 alert(cart) 并且当购物车中应该有值时它总是显示空警报框。

请帮助我,祝你有美好的一天。

4

2 回答 2

1

Javascript 在用户计算机上运行,​​PHP 在服务器上运行。
因此,虽然您可能想使用 javascript 来收集数据,但我很确定您会想用 PHP处理数据,以避免用户太容易干扰它。

“将您的 Ajax 代码视为服务器的另一个客户端”来自针对 jquery ajax 数据发布的安全建议?

于 2013-04-01T21:51:44.147 回答
1

你可以这样做,我创建了一个有效的 JS fiddle 示例。这仅在客户端,您必须编写后端处理脚本,因为我不确定您要做什么(将值保存在数据库中等)。

请看下面的 JS 小提琴:http: //jsfiddle.net/rDgUD/2/

您可以在 jQuery 中使用 .post 命令:

$("#checkoutbutton").click(function () {
   $.post("test.php", cart, function (data) {
        //this is the reponse back from your PHP processing page that saved the variables in a database or however you were handling that.
        alert("Data Loaded: " + data);
    });
});

您可以在 JS 小提琴中看到我如何处理将变量保存到您的购物车数组的过程。您可以使用 jquery 的 .push 功能添加数组元素:

cart.push(id);

我还使用以下代码删除了元素:

var removeItem = id; // item to remove
cart.splice($.inArray(removeItem, cart), 1);
于 2013-04-01T22:21:42.143 回答