19

我正在制作一个游戏，一开始它会询问你的名字，我希望这个名字被保存为变量。

这是我的 HTML 代码：

<form id="form" onsubmit="return false;">
<input   style=position:absolute;top:80%;left:5%;width:40%; type="text" id="userInput">
<input   style=position:absolute;top:50%;left:5%;width:40%; type="submit"    onclick="name()">
</form>

这是我的 JavaScript 代码

function name()
{
var input = document.getElementById("userInput");
alert(input);
}
4

7 回答 7

30

它不起作用，因为它name是 JavaScript 中的保留字。将函数名称更改为其他名称。

请参阅http://www.quackit.com/javascript/javascript_reserved_words.cfm

<form id="form" onsubmit="return false;">
    <input style="position:absolute; top:80%; left:5%; width:40%;" type="text" id="userInput" />
    <input style="position:absolute; top:50%; left:5%; width:40%;" type="submit" onclick="othername();" />
</form>

function othername() {
    var input = document.getElementById("userInput").value;
    alert(input);
}
于 2013-07-02T19:07:26.357 回答
8

首先，使您的标记更便携/可重用。我还将按钮的类型设置为'button'而不是使用onsubmit属性。如果表单需要与服务器交互，您可以切换type属性。submit

<div class='wrapper'>
<form id='nameForm'>
<div class='form-uname'>
    <label id='nameLable' for='nameField'>Create a username:</label>
    <input id='nameField' type='text' maxlength='25'></input>
</div>
<div class='form-sub'>
    <button id='subButton' type='button'>Print your name!</button>
</div>
</form>

<div>
    <p id='result'></p></div>
</div>

接下来编写一个通用函数，用于将用户名检索到变量中。它检查以确保保存用户名的变量中至少包含三个字符。您可以将其更改为您想要的任何常数。

function getUserName() {
var nameField = document.getElementById('nameField').value;
var result = document.getElementById('result');

if (nameField.length < 3) {
    result.textContent = 'Username must contain at least 3 characters';
    //alert('Username must contain at least 3 characters');
} else {
    result.textContent = 'Your username is: ' + nameField;
    //alert(nameField);
}
}

接下来，我为按钮创建了一个事件监听器。内联 js 调用通常被认为是不好的做法。

var subButton = document.getElementById('subButton');
subButton.addEventListener('click', getUserName, false);

这是一个工作且风格简单的演示：

这个答案的 CodePen 演示。

于 2015-09-07T22:41:31.157 回答
3

将您的 javascript 更改为：

var input = document.getElementById('userInput').value;

这将获取已输入文本框中的值，而不是 DOM 对象

于 2013-07-02T18:55:02.020 回答
2

您可以同时使用 PHP 和 JavaScript：

<input type="hidden" id="CatId" value="<?php echo $categoryId; ?>">

现在更新 JavaScript：

var categoryId = document.getElementById('CatId').value;
于 2019-01-04T10:32:40.253 回答
1 
<html>    
    <input type="text" placeholder ="username" id="userinput">
    <br>
    <input type="password" placeholder="password">
    <br>
    <button type="submit" onclick="myfunc()" id="demo">click me</button>

    <script type="text/javascript">
        function myfunc() {
            var input = document.getElementById('userinput');
            alert(input.value);
        } 
    </script>
</html>
于 2019-11-30T10:01:20.947 回答
1

我发现这最适合我 试试这个小提琴

document.getElementById("btnmyNumber").addEventListener("click", myFunctionVar);
function myFunctionVar() {
  var numberr = parseInt(document.getElementById("myNumber").value, 10);
  // alert(numberr);
  if ( numberr > 1) {

    document.getElementById("minusE5").style.display = "none";



}}
   <form onsubmit="return false;">
       <input class="button button3" type="number" id="myNumber" value="" min="0" max="30">
       <input type="submit" id="btnmyNumber">

       </form>

于 2019-05-22T19:47:48.437 回答
1

我的意思是，如果 HTML 方面不需要该变量，则提示脚本会起作用，即使在某些情况下，也可以使用函数。

var save_user_input = prompt('what needs to be saved?');
//^ makes a variable of the prompt's answer
if (save_user_input == null) {
//^ if the answer is null, it is nothing
//however, if it is nothing, it is cancelled (as seen below). If it is "null" it is what the user said, then assigned to the variable(i think), but also null as in nothing in the prompt answer window, but ok pressed. So you cant do an or "null" (which would look like: if (save_user_input == null || "null") {)because (I also don't really know if this is right) the variable is "null". Very confusing
alert("cancelled");
//^ alerts the user the cancel button was pressed. No long explanation this time.
}
//^ is an end for the if (i got stumped as to why it wasn’t working and then realised this. very important to remember.)
else {
alert(save_user_input + " is what you said");
//^ alerts the user the variable and adds the string " is what you said" on the end
}

于 2020-12-23T10:25:02.883 回答