如何修复lootbox opener中的计数系统?

时间:2017-05-12 18:24:49

标签: javascript html css

我正在制作一个战利品盒模拟器,我遇到了一个问题。我希望它计算法线,传奇,史诗,雷尔斯的数量,我想我已经拥有它,但它只创建了一个文本节点,如果他们得到3正常,他们的第一次去,那么它将显示“正常: 3“但在第二次去说他们有另外3个正常,然后它将显示”正常:36“因为它只是添加分数并使其成为另一个文本节点。求救!

JS:

function displayBox(){
  //Add to list
  for(i = 0; i < endresults.length; i++){
    var ul = document.getElementById("crate");
    var li = document.createElement("li");
    var span = document.createElement("span");
    var node = document.createElement("LI");    
    span.appendChild(document.createTextNode(endresults[i]));
    li.setAttribute("id", "item" + i);
    ul.appendChild(li);
    li.appendChild(span);

    //Check Quality and Strip
    var str = $("#item" + i).text();
    console.log(str);
    var e = document.getElementById("purple-stat")
    var l = document.getElementById("orange-stat")
    var r = document.getElementById("blue-stat")
    var n = document.getElementById("white-stat")

    var textnode = document.createTextNode(str);  
    node.appendChild(textnode)
     if(endresults[i].indexOf("Normal") !=-1){
      $("#item" + i).addClass("normal animated bounceInDown");
      $("#item" + i ).find('span').text(str.substring(7));
      node.id = "norm"
      nscore = nscore + 1
    }
    if (endresults[i].indexOf("Rare") !=-1){
      $("#item" + i).addClass("rare animated bounceInDown");
      $("#item" + i).find('span').text(str.substring(5));
      node.id = "rr"
      rscore = rscore + 1
    }
    if(endresults[i].indexOf("Epic") !=-1){
      $("#item" + i).addClass("epic animated bounceInDown");
      $("#item" + i).find('span').text(str.substring(5));
      node.id="epc"
      escore = escore + 1
    }
    if(endresults[i].indexOf("Lgnd") !=-1){
      $("#item" + i).addClass("legendary animated bounceInDown");
      $("#item" + i).find('span').text(str.substring(5));
      node.id = "lgnd"
      lscore = lscore + 1
    }
    document.getElementById("itemlog").appendChild(node);  
    //Check Hero
    //Generic
    if(endresults[i].indexOf("Spray") || endresults[i].indexOf("Coins") !=-1){
      $("#item" + i).addClass("generic");
    }
    //orisa
    if(endresults[i].indexOf("Orisa") !=-1){
      $("#item" + i).addClass("orisa");
    }

    //sombra
    if(endresults[i].indexOf("Sombra") !=-1){
      $("#item" + i).addClass("sombra");
    }
    //ana
    if(endresults[i].indexOf("Ana") !=-1){
      $("#item" + i).addClass("ana");
    }
    //bastion
    if(endresults[i].indexOf("Bastion") !=-1){
      $("#item" + i).addClass("bastion");
    }
    //dva
    if(endresults[i].indexOf("D.Va") !=-1){
      $("#item" + i).addClass("dva");
    }
    //genji
    if(endresults[i].indexOf("Genji") !=-1){
      $("#item" + i).addClass("genji");
    }
    //hanzo
    if(endresults[i].indexOf("Hanzo") !=-1){
      $("#item" + i).addClass("hanzo");
    }
    //junkrat
    if(endresults[i].indexOf("Junkrat") !=-1){
      $("#item" + i).addClass("junkrat");
    }
    //lucio
    if(endresults[i].indexOf("Lucio") !=-1){
      $("#item" + i).addClass("lucio");
    }
    //McCree
    if(endresults[i].indexOf("McCree") !=-1){
      $("#item" + i).addClass("mccree");
    }
    //Reaper
    if(endresults[i].indexOf("Reaper") !=-1){
      $("#item" + i).addClass("reaper");
    }
    //Mei
    if(endresults[i].indexOf("Mei") !=-1){
      $("#item" + i).addClass("mei");
    }
    //Mercy
    if(endresults[i].indexOf("Mercy") !=-1){
      $("#item" + i).addClass("mercy");
    }
    //Pharah
    if(endresults[i].indexOf("Pharah") !=-1){
      $("#item" + i).addClass("pharah");
    }
    //Reinhardt
    if(endresults[i].indexOf("Reinhardt") !=-1){
      $("#item" + i).addClass("reinhardt");
    }
    //Roadhog
    if(endresults[i].indexOf("Roadhog") !=-1){
      $("#item" + i).addClass("roadhog");
    }
    //Solider76
    if(endresults[i].indexOf("Soldier: 76") !=-1){
      $("#item" + i).addClass("soldier");
    }
    //Symmetra
    if(endresults[i].indexOf("Symmetra") !=-1){
      $("#item" + i).addClass("symmetra");
    }
    //Torbjorn
    if(endresults[i].indexOf("Torbjorn") !=-1){
      $("#item" + i).addClass("torbjorn");
    }
    //Tracer
    if(endresults[i].indexOf("Tracer") !=-1){
      $("#item" + i).addClass("tracer");
    }
    //Widowmaker
    if(endresults[i].indexOf("Widowmaker") !=-1){
      $("#item" + i).addClass("widowmaker");
    }
    //Winston
    if(endresults[i].indexOf("Winston") !=-1){
      $("#item" + i).addClass("winston");
    }
    //Zarya
    if(endresults[i].indexOf("Zarya") !=-1){
      $("#item" + i).addClass("zarya");
    }
    //Zenyatta
    if(endresults[i].indexOf("Zenyatta") !=-1){
      $("#item" + i).addClass("zenyatta");
    }

  }
  isRunning = false;
  var nnode = document.createTextNode(nscore.toString())
  n.appendChild(nnode)
  var lnode = document.createTextNode(lscore.toString())
  l.appendChild(lnode)
  var rnode = document.createTextNode(rscore.toString())
  r.appendChild(rnode)
  var enode = document.createTextNode(escore.toString())
  e.appendChild(enode)
}

1 个答案:

答案 0 :(得分:0)

当你从任何UI元素中获取价值时,它们就会变成字符串,即使它看起来像是一个数字。因此,在使用此类值进行任何数学运算之前,只需将其转换为数字即可。 例如:

var strNum = $('#myNumver').text();
var num = Number(strNum);
$('#myNumver').text(num+3);