使用jQuery更改div后的原始值

Question

我试图重现我所见过的游戏机制。这个机制就是枪支重新装填。

目前，我已经设置好了，所以当你点击一个div的类"。weapon"它会对"弹药"进行倒计时，如果你数到0，它会告诉你没有弹药。

如果你点击并按住"武器"在x的时间内，它将重新加载。

当我做任何事情时总是有很多问题-_-是当我想重新加载武器3时，例如，我不知道如何获得"弹药"的原始值;那个div(".weapon")以。

我试图在var中设置值，但我不确定这是否需要在对象或类似的东西中完成?

最让我困惑的是jQuery $(this)。

例如5div类"。weapon"我知道你可以创建一个点击函数(或其他任何东西)来隐藏类"。weapon"单独取决于你点击哪个div，而不是隐藏它们。但是我想用var做的事情显然是不一样的，反正我也不这么认为。

我非常肯定，除了我强调的问题之外，其他所有事情都做得不对，所以如果你想让我知道它有多糟糕，请随意，哈哈。

不确定这是否有意义，因为我也不擅长解释自己。(反正不是文字)

如果你想帮忙，我需要进一步解释任何事情，请让我知道，谢谢你甚至阅读这篇文章，如果你这样做了。

HTML

<div id="wrapper">
<div class="weapon center">
<div class="ammo">5</div>
</div>
<div class="weapon center">
<div class="ammo">8</div>
</div>
<div class="weapon center">
<div class="ammo">10</div>
</div>
<div class="weapon center">
<div class="ammo">12</div>
</div>
<div class="message"></div>
</div>

CSS

#wrapper{
width:40%;
margin:30px auto;
}
.weapon{
float:left;
width:80px;
height:80px;
border: 2px dashed #000;
padding:5px;
margin:5px;
line-height:80px;
text-align:center;
}

JQuery

$(document).ready(function(){
var n;
var currentReload = 0;
var reloaded = false;
$('.weapon').ready(function(){
bb = $(this);
bcurrentAmmo = bb.find('.ammo').html();
});
function reload(bb,bcurrentAmmo) {
if(currentReload <= 2){
currentReload++;
}else{
bb.find('.ammo').html(bcurrentAmmo);
reloaded = true;
clearInterval(n);
}
}
$('.weapon').mousedown(function(){
reloaded = false;
n = setInterval(function() { reload(bb,bcurrentAmmo);}, 100);
}).mouseup(function() {
currentReload = 0;
clearInterval(n);
});
$('.weapon').click(function(){
if(reloaded == false){
b = $(this);
currentAmmo = b.find('.ammo').html();
if(currentAmmo >= 1){
currentAmmo--;
}else{
$('.message').html("No Ammo! Click & Hold To Reload")
}
b.find('.ammo').html(currentAmmo);
}
});
});

Answer 1

为标签为"maxAmmo"的元素添加一个属性。然后你可以使用element.getAttribute("maxAmmo")来获得原始弹药值。