JS:如何实现两个字符串的加和,而不是放在一起?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (185)

我需要javascript将5添加到整数变量中,但是它将变量视为字符串,因此它会写出变量,然后将5添加到“String”的末尾。

var dots = 5
function increase(){
dots = dots+5;
}

输出:55

我怎样才能 令它输出10呢?

可能是我的脚本出错了吗?

<html>
<head>
<title>Counting Game</title>
<style type="text/css">
.dot {
    position: absolute;
}
#control {
    position: absolute;
    width: 220px;
    height: 90px;
    margin-top: -102px;
    margin-left: -222px;
    left: 100%;
    top: 100%;
    text-align: center;
    vertical-align: middle;
    border: 1px dotted #000;
    padding-top: 10px;
    background-color: transparent;
}
#gameover h1 {
    font-variant: small-caps;
}
#gameover {
    text-align: center;
    visibility: hidden;
}
#txt {
    text-align: center;
}
body {
    background-color:  #6FF;
}
#intro, #gameover {
    height: 300px;
    width: 250px;
    margin-top: -150px;
    margin-left: -125px;
    position: absolute;
    left: 50%;
    top: 50%;

}
#dots {
    position: absolute;
    left: 0px;
    top: 0px;
}
</style>
<script type="text/javascript">
var num;
var digits;
var size;
var bsize;
var bsizew;
var bsizeh;
var lvlv;
var hearts;
var t;
var answer = false;
var lvl=1;
var oldlvl=1;
var btn = 2;
var dots = 5;
var arrx = [];
var arry = [];
var lifestf = true;
var timertf = true;
var auto = true;
var level = 1;
var life = 4;
var resetv = false;

function docload() {
    document.getElementById("txt").focus();
}

function createdots() {
    answer = false;
    document.getElementById("txt").value = ""
    document.getElementById("txt").focus()
    document.getElementById("txt").style.color = "#000000"
    document.getElementById("control").style.backgroundColor = "#6FF"
    document.body.style.backgroundColor  = "#6FF"
    num = Math.floor(Math.random() * dots) + 1;
    digits = num.toString().length
    bsize = Math.min(document.body.clientWidth, document.body.clientHeight);
    bsizew = document.body.clientWidth;
    bsizeh = document.body.clientHeight;
    if ([[bsizeh*bsizew]-[220*90]] > num*num*25000) {size=100}
    else if ([[bsizeh*bsizew]-[220*90]] > num*num*2500) {size=50}
    else if ([[bsizeh*bsizew]-[220*90]] > num*num*25*25) {size=25}
    else {size=10}
    function createDot(x, y) {
        var elem = document.createElement("div");
        elem.setAttribute("class", "dot");
        elem.setAttribute("style", "left:"+ x+"px;top:"+y+"px;"+"width: "+size+"px;"+"height: "+size+"px;"+"background-image: url(dot"+size+".png);");
        document.getElementById("dots").appendChild(elem);
        btn = 1
        return elem;
    }

    function anotherDot() {
        var x = Math.floor(Math.random() * (bsizew-size));
        var y = Math.floor(Math.random() * (bsizeh-size));
        ok = true;
        for (var i in arrx) {
            if (arrx[i] <= x + size && arrx[i] >= x - size) {
                ok = false;
            }
        }
        for (var i = 0; i < arry.length; i++) {
            if (arry[i] <= y + size && arry[i] >= y - size) {
                ok = false;
            }
        }
        if (x > bsizew-size-220 && y > bsizeh-size-90) {ok = false;}
        if (ok) {
            arrx.push(x);
            arry.push(y);
            createDot(x, y);
        }
        !ok && anotherDot();
    }
    for (var i = 0; i < num; i++) {
        anotherDot();
        document.getElementById("max").innerHTML="Max: "+dots;
    }
}

function resetg() {
    document.getElementById("txt").style.color = "#000000"
    document.getElementById("control").style.backgroundColor = "#6FF"
    document.body.style.backgroundColor  = "#6FF"
    document.getElementById("gameover").style.visibility = "hidden";
    document.getElementById("intro").style.visibility = "visible";
    document.getElementById("control").style.visibility = "visible";
    document.getElementById("life").innerHTML='<label><input id="lifecheck" type="checkbox" checked="true">Lives</label>'
    document.getElementById("level").innerHTML='<label><input id="autocheck" type="checkbox" checked="true">Auto</label>'
    document.getElementById("max").innerHTML=''
    document.getElementById("timer").innerHTML='<label><input id="timercheck" type="checkbox" checked="true">Timer</label>'
    lvl=1
    btn = 2;
    dots = 5;
    arrx = [];
    arry = [];
    lifestf = true;
    timertf = true;
    auto = true;
    level = 1;
    life = 4;
    resetv = false;
    lvlv = '';
    document.getElementById("txt").value = "5"
    document.getElementById("txt").focus()
}

function checkanswer() {
    answer = true;
    if (document.getElementById("txt").value == arrx.length) {
        document.getElementById("txt").value = "CORRECT!"
        document.getElementById("txt").style.color = "#00DD00"
        document.getElementById("control").style.backgroundColor = "#00FF00"
        document.body.style.backgroundColor  = "#00FF00"
        btn = 0
        lvl++;
    } 
    else if (document.getElementById("txt").value != arrx.length) {
        document.getElementById("txt").value = "Correct Answer: " + arrx.length
        document.getElementById("txt").style.color = "#DD0000"
        document.getElementById("control").style.backgroundColor = "#C00"
        document.body.style.backgroundColor  = "#C00"
        if (lifetf==true){
                hearts = "";
                for(i=0;i<life;i++){
                    hearts += "&#9829; ";
                }
        document.getElementById("life").innerHTML = hearts;
        life--;
        }
        btn = 0
        lvl > 1 && lvl--;
        if (lvl == oldlvl + 5) {
            oldlvl = lvl;
            dots = dots+5;
        }
        else if (lvl < oldlvl) {
            oldlvl = lvl - 5;
            dots = dots+5;
        }
        if (life<0){
            lvlv="wtfiswrongwithyou"
        }
    }
}

function submitenter() {
    var keycode = window.event.keyCode;
    if (keycode == 13) {
        !resetv && btnclick();
        resetv && resetg();
    }
    if (keycode < 47 || keycode > 58 || answer) {
        return false;
    }
}

function quickanswer() {
    if (auto == true && document.getElementById("txt").value.length == digits) {
        document.getElementById("dots").innerHTML = ""
        arrx = [];
        arry = [];
        createdots()
    }
}

function btnclick() {
    if (btn == 1) {
        checkanswer()
    } 
    else if (btn == 2) {
        lifetf = document.getElementById("lifecheck").checked;
        timertf = document.getElementById("timercheck").checked;
        auto = document.getElementById("autocheck").checked;
        dots = document.getElementById("txt").value;
        document.getElementById("life").innerHTML="&#9829; &#9829; &#9829; &#9829; &#9829; "
        document.getElementById("level").innerHTML=lvl
        document.getElementById("max").innerHTML=dots
        document.getElementById("intro").style.visibility= "hidden"
        btn = 0;
        document.getElementById("txt").value = ""
        document.getElementById("txt").focus()
        btnclick();
    }
    else if (lvlv != "wtfiswrongwithyou") {
        document.getElementById("dots").innerHTML = ""
        arrx = [];
        arry = [];
        createdots();
        if (timertf==true) {
            clearTimeout(t)
            timer(2, 0)
        }
        document.getElementById("level").innerHTML=lvl
    }
    else {
        document.getElementById("dots").innerHTML = ""
        arrx = [];
        arry = [];
        document.getElementById("txt").value = ""
        document.getElementById("txt").focus()
        document.getElementById("txt").style.color = "#C00"
        document.getElementById("control").style.backgroundColor = "#C00"
        document.body.style.backgroundColor  = "#C00"
        document.getElementById("gameover").style.visibility = "visible";
        document.getElementById("intro").style.visibility = "hidden";
        document.getElementById("control").style.visibility = "hidden";
        resetv=true;
    }
}

function timer(s,ms) {
    if (lvlv != "wtfiswrongwithyou") {
        milisec = ms
        seconds = s

        function display() {
            if (milisec <= 0) {
                milisec = 9
                seconds -= 1
            }
            if (seconds <= -1) {
                milisec = 0
                seconds += 1
            } else
            milisec -= 1
            document.getElementById("timer").innerHTML = "Time: " + seconds + "." + milisec
            if (seconds != 0 || milisec != 0) {
                t = setTimeout(display, 100)
            }
            if (seconds == 0 && milisec == 0) {
                btnclick()
            }
        }
        display()
    } else {
        document.getElementById("timer").innerHTML = ""
    }
}
</script>
</head>

<body onLoad="docload()" onKeyPress="return submitenter()" >
<div id="dots"></div>
<div id="gameover"><h1>Game Over</h1>Would you like to play again?<br><br><br><input type="button" value="OK" onClick="resetg()"></div>
<div id="intro">Count all the dots that appear on screen as fast as possible and enter the number below. The point of this game is not to count each individual dot, but rather to immediately know exactly how many dots are apparent.<br>
<br>
<br>
Please select what the maximum number of dots should appear when you begin:</div>
<div id="control">
<input id="txt" type="text" value="5"/>
<input type="button" onClick="btnclick()" value="OK"/><br>
<center><table width="200">
  <tr>
    <td align="left" valign="middle"><span id="life"><label><input id="lifecheck" type="checkbox" checked="true">Lives</label></span></td>
    <td align="right" valign="middle"><span id="timer"><label><input id="timercheck" type="checkbox" checked="true">Timer</label></span></td>
  </tr>
  <tr>
    <td align="left" valign="middle"><span id="level"><label><input id="autocheck" type="checkbox" checked="true">Auto</label></span></td>
    <td align="right" valign="middle"><span id="max"></span></td>
  </tr>
</table></center>
</div>
</body>
</html>
提问于
用户回答回答于
dots = document.getElementById("txt").value;

若要将其转换为int,请将该行更改为:

dots = parseInt(document.getElementById("txt").value);

热门问答

腾讯云广州一区DNS变更,需要怎么操作?

思潮澎湃轻描淡写的生活,但思潮澎湃
推荐
我也收到相关的通知了,这里分享下~ 2019年1月31日,腾讯云将对广州地区旧的基础网络DNS服务器(10.225.30.181、10.225.30.223)进行下线。在此期间,腾讯云提供最新的DNS服务器供您更新使用。 我们建议您尽快将DNS服务器配置进行更新,并且我们为您提供...... 展开详请

快照容量与费用的比例?如何关闭停用?

帅的惊动我国计算机大神
推荐已采纳
快照已于2019年1月22日0时启动正式商业化进程,商业化后所有存量快照和新产生的快照将根据快照使用的存储容量进行收费。 在快照商业化后,腾讯云仍旧会在国内主要地域为用户提供一定量的免费额度。免费额度策略如下: 免费额度覆盖范围为中国大陆地域,中国香港及海外地域暂无免费快照额...... 展开详请

无服务器云函数的cron表达式问题?

腾讯云serverless团队

腾讯云 · 产品团队 (已认证)

腾讯云无服务器云函数SCF产品
推荐
https://cloud.tencent.com/document/product/583/9708#cron-.E8.A1.A8.E8.BE.BE.E5.BC.8F.E8.AF.AD.E6.B3.95.E4.B8.80.EF.BC.88.E6.8E.A8.E8.8D.90.E...... 展开详请

云服务器-intelS2 标准入门型 带独立ip么?

Eli Qiao

腾讯 · 高级工程师 (已认证)

腾讯云CVM后台高级研发工程师
推荐

购买时,可以配置wan网ip,也可以之后添加eip

购买云服务器后上面的是否配套有数据库(mysql, sql server)和Web服务器等?

西风

renzha.net · 站长 (已认证)

www.renzha.net
推荐已采纳

买了服务器自己安装配置数据库即可,也可以另外选购性能更高,更安全可靠的云数据库。

无服务器云函数添加触发方式以错误码9000失败?

腾讯云serverless团队

腾讯云 · 产品团队 (已认证)

腾讯云无服务器云函数SCF产品
推荐

实在抱歉,最近这两天由于广州区 api 网关集群的配置量已超上限,导致 api 网关无法新增服务。目前 api 网关的研发同学已经在紧急扩容广州区集群了。

所属标签

扫码关注云+社区