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

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

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

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

热门问答

腾讯云 COS 怎么才能外链调用 m3u8 到别的网站播放?

滑稽园扛把子

Swoole · PHP开发工程师 (已认证)

As a PHP Developer
推荐
设置公有读私有写:当访问对象时,COS 读取到对象的权限为公有读,此时无论存储桶为何种权限,对象都可以被直接下载 设置步骤 登录 对象存储控制台,选择左侧菜单栏【存储桶列表】,进入存储桶列表页面。单击需要修改对象权限的对应存储桶,进入存储桶。 📷 找到需要设置权限的对象(如 e...... 展开详请

Ubuntu搭建的WordPress如何修改php.ini?

滑稽园扛把子

Swoole · PHP开发工程师 (已认证)

As a PHP Developer
推荐
php新手很多不知道怎么查配置文件在哪,这里提供一个很简单的方法 使用 php -i 命令可以打印php的详细信息,可以把这堆东西输出一下 php -i > outputphp.txt,结合 grep 查找命令 php -i| grep php.ini 打印结果如下 Config...... 展开详请

归档存储采用的存储介质是什么, 安全可靠吗?

滑稽园扛把子

Swoole · PHP开发工程师 (已认证)

As a PHP Developer
推荐
归档存储主要是针对海量、重要且访问频率极低的非结构化数据进行长期的归档保存和备份管理。 在数据安全层面,归档存储提供数据锁定机制,防止数据被修改和删除,保障数据安全。 技术架构: image.png 与对象存储的差异 归档存储 CAS 是一项离线存储服务,不同于在线的对象存储 ...... 展开详请

在按官网手册排错后依然提示1004错误?

看你的代码好像是短信相关的代码,1004错误代表请求包解析失败,通常情况下是由于没有遵守 API 接口说明规范导致的。 建议您通过以下方式定位解决: 首先,要确认发送的请求是否是标准的 json 格式; 第二,检查是否有将单引号当做双引号使用(json 标准应该是双引号); 第...... 展开详请

redis数据库应该怎样连接???

滑稽园扛把子

Swoole · PHP开发工程师 (已认证)

As a PHP Developer
推荐
实例初始化完成后,连接腾讯云Redis时,需要输入设置的密码。主从版和集群版的连接示例如下 主从版连接示例 主从版支持2种格式 • 格式1,“实例id:密码”的格式类型,例如您的实例id是crs-bkuza6i3,设置的密码是abcd1234,则连接命令如下 redis-cli ...... 展开详请

如何使用holer实现从外网访问本地WEB应用?

Dingda

Dingda · 站长 (已认证)

多一些不为什么的坚持
推荐
解压holer软件 获取holer access key信息: 在holer官网上申请专属的holer access key或者使用开源社区上公开的access key信息。 启动holer服务: Windows系统平台: 打开CMD窗口进入可执行程序所在的目录下,执行命令:...... 展开详请

所属标签

扫码关注云+社区