简体   繁体   English

如何在输入中检索值?

[英]How to retrieve the value in the input?

I'm trying to retrieve the value in the input, however I'm not too sure how to do this. 我正在尝试检索输入中的值,但是我不太确定如何执行此操作。

Here is my code: 这是我的代码:

<body onload="displayMessage()">
  <h1> JavaScript Arrays</h1>
  <br>
  <form name="hey">
    Enter value:
    <br>
    <input type="" name="firstname" value="">
    <br>
    <button type="button" onclick="displayMessage()">Add to list</button>
  </form>

  <p></p>

  <p id="pie"></p>

  <br>

  <p id="beef"></p>

</body>

You're missing the + sign after "The user entered: " , and I assume you want to push userInput instead of "Arrays" into the array. "The user entered: " ,您缺少+号,并且我假设您想将userInput而不是"Arrays"推入数组。

I also used .insertAdjacentHTML() so that you didn't overwrite the original .innerHTML setting. 我还使用了.insertAdjacentHTML()以便您不会覆盖原始的.innerHTML设置。 I shortened the code as well by storing the pie element in a variable. 通过将pie元素存储在变量中,我也缩短了代码。

 var Arrays = ["Printer", "Tablet", "Router", "Smart phone", "Motherboard", "Hard drive"]; document.getElementById("beef").innerHTML = Arrays; function displayMessage() { var userInput = document.hey.firstname.value; var pie = document.getElementById("pie"); // ----------------------------------v pie.innerHTML = "The user entered: " + userInput + "<br>"; Arrays.push(userInput); // <------------ push the new item // Prevent overwrite--v pie.insertAdjacentHTML("beforeend", Arrays); } 
 <h1> JavaScript Arrays</h1> <br> <form name="hey"> Enter value: <br> <input type="" name="firstname" value=""> <br> <button type="button" onclick="displayMessage()">Add to list</button> </form> <p></p> <p id="pie"></p> <br> <p id="beef"></p> 

The rest was correct. 其余的是正确的。


In addition though, It's a good idea to use lowercase words for variable names. 但是,除此之外,将小写单词用作变量名是一个好主意。 This is the common JavaScript convention used. 这是常用的JavaScript约定。

You are not adding userInput to the arrays, you are simply adding a static text 'Arrays' to the array 您没有在数组中添加userInput,只是在数组中添加了静态文本“ Arrays”

function displayMessage() {
  var userInput = document.getElementsByName("firstname")[0].value;
  document.getElementById("pie").innerHTML = "The user entered: " + userInput + "<br>";
  Arrays.push( userInput );
  document.getElementById("pie").innerHTML = Arrays.join( "," );
}

and you also missed the concatenation operator + before userInput as well 而且您也错过了userInput之前的串联运算符+

  • you need a + here user entered: " + userInput 你需要一个+这里user entered: " + userInput
  • Arrays.push(userInput);
  • document.getElementById("beef").innerHTML = Arrays;
  • userInput && Arrays.push(userInput); to prevent empty inserts 防止空插件

 var Arrays = ["Printer", "Tablet", "Router", "Smart phone", "Motherboard", "Hard drive"]; document.getElementById("beef").innerHTML = Arrays; function displayMessage() { var userInput = document.hey.firstname.value; userInput && Arrays.push(userInput); document.getElementById("pie").innerHTML = ("The user entered: " + userInput + "<br>"); document.getElementById("beef").innerHTML = Arrays; } 
 <body onload="displayMessage()"> <h1> JavaScript Arrays</h1> <form name="hey"> Enter value: <input type="" name="firstname" value=""> <button type="button" onclick="displayMessage()">Add to list</button> </form> <p id="pie"></p> <p id="beef"></p> 

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM