1

我对此很陌生,因此请提前为冒犯/惹恼任何人道歉。

我已经建立了我的第一个网站 ( http://www.goodgollyexeter.co.uk )。我的网站上有一个购物车(我使用的 Plum shop 很好用)。我希望用户能够单击“查看购物车”按钮(位于具有 的网站的右上角id="viewcart"),然后将其购物车的内容显示在灯箱样式窗口中。他们购物车的内容包含在一个<div>which has 中id="cart_holder"

为了尝试实现上述目标,我正在使用 lightbox_me,但我无法通过“查看购物车”按钮单击事件来实现它。如果我删除按钮单击事件编码,那么 lightbox_me 可以工作并显示购物车的内容,但是由于没有触发它的事件,它会在页面加载后立即打开。现在我已经删除了按钮单击事件编码,因此如果您要访问该网站,您应该会看到 lightbox_me 工作(但在页面加载而不是按钮单击事件时)。

我试图挑选出相关代码并在下面显示。这是我为了让 lightbox_me 摆脱“查看购物车”按钮单击事件(改编自 lightbox_me 网站示例)而尝试的代码,但这不起作用:

<head>
<script src="js/jquery.js"></script>
<script src="js/jquery.lightbox_me.js"></script>
</head>
<body>

<button id="viewcart" class="viewcart">View Cart</button>

<div id="cart_holder">
<h1> Your Cart </h1>
<p>Currently your cart contains the following items:</p>
<div id="cart"></div>
<label>Items:</label> <span class="cart-quantity">0</span><br>
<label>Sub-Total:</label> <span class="cart-subtotal">£0.00</span><br>
<label>Shipping:</label> <span class="cart-shipping">£0.00</span><br>
<label>Total:</label> <span class="cart-total">£0.00</span><br>
<br>
Please click below to pay using a credit or debit card or via Paypal:
<br>
<br>
<button class="paypal">Checkout</input>
</div>

<script>
$("#viewcart").click(function() {
$("#cart_holder").lightbox_me();
});
</script>

</body>

当我添加上面的代码时,lightbox_me 停止工作,这真的很烦人,好像我删除了查看购物车按钮单击事件编码,所以它看起来像这样:

<script>
$("#cart_holder").lightbox_me();
</script>

然后 lightbox_me 工作(但仅在页面加载而不是在按钮单击事件上)。

我不知道它是否有用,但是当我检查<div id="cart_holder">Chrome 中的元素时,我确实注意到以下错误消息:

Uncaught TypeError: Object [object Object] has no method 'lightbox_me' 

由于我的无知,我担心这对我来说意义不大。如果有人能告诉我我做错了什么以及如何让 lightbox_me 从“查看购物车”按钮单击事件中工作,我将非常感激。请让我知道我是否可以更好地解释或发布更多代码或其他任何内容以提供更好的帮助。谢谢亚历克斯

4

1 回答 1

0

检查您的最后一个关闭按钮标签以进行结帐:

<button class="paypal">Checkout</input>  <!-- should this close with button and not input? -->

你能像这样包装你的jquery吗?

;(function($){  // add 

    $(document).ready(function(){

        $("#viewcart").button().click(function() {
            $("#cart_holder").lightbox_me();        
        });

    });

})(jQuery);  // add
于 2013-10-02T23:07:55.733 回答