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

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

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

我需要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);

热门问答

mqtt通信数据转发至另一Topic失败?

推荐已采纳

设置转发的这个产品的数据格式设置的是自定义,系统会认为所有数据都是二进制数据。如果需要使用json解析,需要设置产品数据格式是JSON。

腾讯云GPU服务器不能联外网吗?

小爱同学

腾讯云 · 技术支持 (已认证)

推荐
腾讯云GPU服务器可连外网,GPU 云服务器提供和标准CVM 云服务器一致的方便快捷的管理方式。 图片.png GPU云服务器作为CVM云服务器的一类特殊实例,购买、 操作、维护等方式与CVM云服务器一致 图片.png GPU 云服务器(GPU Cloud Computin...... 展开详请

win服务器怎么给文件夹配置755权限?

推荐
下面以腾讯云win服务器(Windows Server 2016 数据中心版 64位中文版)为文件夹配置755权限为例 1.右击【属性】 图片.png 2 .选择【安全】- 【编辑】 图片.png 3. 可对当前文件进行755权限配置 图片.png 要修改某个文件的权...... 展开详请

腾讯云sdk 兼容JDK6?

推荐

如果你说的是https://cloud.tencent.com/document/sdk/Java的话,jdk最低版本是1.7,不支持1.6

android 离线推送 为什么setOfflinePushListener不回调?

嗨喽你好摩羯座
推荐
您好,使用云通信 IM SDK 的通知栏提醒,建议参考:https://cloud.tencent.com/document/product/269/9234 中的描述来操作,通知栏提醒的内容由类 TIMOfflinePushNotification 来定义,可以通过这个类对外...... 展开详请

为什么cmq的topic配置订阅者为queue,向topic发送消息无法到达queue?

是的, 向topic发送消息应该会立即投递到订阅者。您可以检查您配置的队列名称是否正确且是真实存在的队列。如还不能解决您的问题,您可以点击控制台右上角的“工单”,进行问题进一步的排查,腾讯云会有专业的售后24小时为您服务。

所属标签

扫码关注云+社区