lightbox_me 不处理点击事件

lightbox_me not working on click event

本文关键字：事件 处理 me lightbox      更新时间：2023-09-26

我对此很陌生，所以提前为冒犯/打扰任何人道歉。

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

为了尝试实现上述目标，我正在使用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工作(但仅在页面加载时而不是在按钮单击事件时(。

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

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

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

检查结帐的最后一个关闭按钮标签：

<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
相关文章：