0

我有一个网站，上面有一个“商店”，您可以在其中使用“硬币”购买东西。现在，我正在创建商店并对其进行测试，所以请在此处查看它 http://coinawards.net63.net/structure/shop.php

因此，当您单击“购买 40 个硬币”的框时，它会弹出一个浅蓝色框，上面写着“已添加到您的购物车”。

现在，我的代码说一旦“购买”按钮被模糊，弹出窗口应该消失......但它没有。我将在下面发布我的代码，希望有人知道如何修复它！

代码：

function init()
{

    var buyinfobutton = $(".buyinfo");

    buyinfobutton.on("click",AddToCart);

    buyinfobutton.on("blur",popUpVanish);

    $('#confirmbox').hide();

}

onload = init;

var shoppingcart = {};

function AddToCart()
{
    // This is called properly.
    $('#confirmbox').show('normal');

}

function popUpVanish()
{
    // This is never called!
    $('#confirmbox').hide();

}

此外，如果您看到我的网站并认为它需要在某个区域进行一些改进（我知道有些部分很糟糕），请也记下它！谢谢！

4

2 回答 2

1

这就是我想出的，我认为它正在寻找什么。我稍微重构了你的代码。

http://jsfiddle.net/kYT5U/

$(document).ready(function() {
    $(".buyinfo")
    .click(AddToCart)
    .mouseout(popUpVanish);
    $('#confirmbox').hide();
});

var shoppingcart = {};

function AddToCart() {
    $('#confirmbox').show('normal');
}

function popUpVanish() {
    $('#confirmbox').hide();
}

更新 jsfiddle 延迟和淡出 http://jsfiddle.net/kYT5U/1/

于 2013-03-29T18:15:22.590 回答
1

问题是您试图在div默认不支持焦点的 DOM 元素 ( ) 上使用与焦点相关的事件（在某些浏览器中）。如果您使用.buyinfo类设置's的tabindex属性，您的代码将按预期工作。您可以在此处参考答案以获取更多详细信息，但是如果您将此属性设置为divdiv

$(".buyinfo").attr("tabindex", -1)

然后它将按预期工作。

于 2013-03-29T18:17:51.980 回答