Question

我正在尝试使用文本输入和提交按钮创建一个日志框。我可以用

显示输入的文字

var test = function() {
var test1 = document.getElementById('input');
var totalTest = test1.value;
document.getElementById('log').innerHTML += totalTest; 
};

但是我无法回应它。我想继续提问，所有答案都来自一个输入框。我对JavaScript很新，并且会喜欢任何人的帮助。这是我到目前为止所有的一切。 JAVASCRIPT：

var playerInput = function () {
var pInput = document.getElementById('input');
var input = pInput.value;
};

var playerNum = function () { //Choice between Single and Multiplayer
     document.getElementById('log').innerHTML = "Would you like to play singleplayer or    multiplayer?";
oneOrTwo(input);
};

var oneOrTwo = function (input) {
    var playerAmount = input;
    if (playerAmount == "singleplayer") {
        //singlePlay();
    } else {
        document.getElementById('log').innerHTML = "Multiplayer is coming soon";
        //multiPlay();
    }
};

HTML：

<!DOCTYPE html>
<html>
    <head>
        <title> Rock Paper Scissors, with Single and Multiplayer! </title>
        <link rel='stylesheet' href='style.css'/>
    <script src='script.js'></script>
</head>
<body>
    <div id="logHeader">
        <h1 style="font-size: 20px; font-family: calibri;"> Rock, Paper, Scissors </h1>
    </div>
    <div id="log"></div>
    <br >
    <input id="input" type="text" onFocus="if(this.value=='Type here') this.value='';" style="border: 2px solid; width: 300px; background-color: lightblue;" value="Type here">
    <input type="button" value="Enter" onClick="test()">
    <br >
    <br >
    <input type="button" onclick="playerNum()" value="Start Game">

</body>
</html>

Answer 1

var input = pInput.value;将输入值存储到该变量中。

除非你再次执行同一行，否则它永远不会改变。

将oneOrTwo(input);替换为oneOrTwo(pInput.value);以获取每次新值。

Answer 2

真正需要改变的是将oneOrTwo(input)来电转移到playerInput()功能。

在提出问题之后尝试立即阅读输入是没有意义的;用户没有时间回复。

var playerNum = function () { //Choice between Single and Multiplayer
    document.getElementById('log').innerHTML = "Would you like to play singleplayer or multiplayer?";
    //nothing else, read the input later
};

当玩家输入回复并点击“Enter”按钮时，然后尝试阅读输入：

var playerInput = function () {
    var pInput = document.getElementById('input');
    var input = pInput.value;
    oneOrTwo(input);
};

和相应的HTML：

<input type="button" value="Enter" onClick="playerInput()">

在这里把它扔进JSFiddle：http://jsfiddle.net/KfUp8/

带有文本输入的日志框

2 个答案: