使用表单输入来更改JavaScript变量(如提示)

时间:2014-10-13 17:11:54

标签: javascript html

我已经使用java脚本整理了基于文本的游戏。我问到问题的时候,它会使用一个提示并拉出一个对话框,你必须输入你的答案。我想避免一起使用对话框,而只是让它只是在屏幕上打印问题,并在页面上有一个文本输入框,您可以在其中输入您的答案。我不知道如何将html输入链接到我的javascript,这样它就像提示一样,根据你输入的内容改变变量。

其中一个问题的示例如下:

var seedcomp = 1
while (seedcomp === 1) {
    var seed = prompt("What kind of potato do you want to be? A RUSSET POTATO, RED POTATO, or SWEET POTATO? Type STOP to quit.").toUpperCase();
        var para = document.createElement("p");
        var node = document.createTextNode("What kind of potato do you want to be? A RUSSET POTATO, RED POTATO, or SWEET POTATO?");
        para.appendChild(node);
        var element = document.getElementById("game");
        element.appendChild(para);
        window.scrollBy(0,1000000);
    switch(seed) {
        case 'RUSSET POTATO' :
            var para = document.createElement("p");
            var node = document.createTextNode("> Hot diggity! You became a Russet Potato!");
            para.appendChild(node);
            var element = document.getElementById("game");
            element.appendChild(para);
            seedcomp = 2
            window.scrollBy(0,1000000);
            break;
        case 'RED POTATO' :
            var para = document.createElement("p");
            var node = document.createTextNode("> Greetings comrade! Welcome to the potatoes of Soviet Socialist Republics! You are a Red Potato.");
            para.appendChild(node);
            var element = document.getElementById("game");
            element.appendChild(para);
            seedcomp = 2
            window.scrollBy(0,1000000);
            break;
        case 'SWEET POTATO' :
            var para = document.createElement("p");
            var node = document.createTextNode("> Hey there sweet thing! You're such a Sweet Potato!");
            para.appendChild(node);
            var element = document.getElementById("game");
            element.appendChild(para);
            seedcomp = 2
            window.scrollBy(0,1000000);
            break;
        case 'STOP' :
            var para = document.createElement("p");
            var node = document.createTextNode("> You ended the game. Click PLAY AGAIN to restart!");
            para.appendChild(node);
            var element = document.getElementById("game");
            element.appendChild(para);
            window.scrollBy(0,1000000);
            throw { name: 'stop', message: 'stop' };
            break;
        default:
            var para = document.createElement("p");
            var node = document.createTextNode("> Make sure you are spelling your answers correctly!");
            para.appendChild(node);
            var element = document.getElementById("game");
            element.appendChild(para);
            window.scrollBy(0,1000000);
    }
}

完整的游戏代码可在Here

找到

1 个答案:

答案 0 :(得分:0)

假设你有一个简单的文字输入

<input type="text" id="input-id" value="">

以下是使用JavaScript

获取输入值的方法
var inputValue = document.getElementById('input-id').value;

这是一个非常基本的实现:

<input type="text" id="input-id" value="">
    <button typer="button" onClick="getUserInput();">enter</button>
<script>
function getUserInput() {
    alert( document.getElementById('input-id').value );
}
</script>

http://jsfiddle.net/sfcdrv68/