使用 get 元素按 ID 进行用户输入

Using get element by ID for user input

本文关键字：用户 输入 ID get 元素 使用      更新时间：2023-09-26

我正在尝试编写此Web应用程序，以使用户输入有关其设备的重要信息，然后将其放置在javascript中的相关位置。 这是我到目前为止的代码。

<script type="text/javascript">
        function update() {
            var key = document.getElementById("key").value;
            if (input.length < 40) {
                alert("Please enter a valid input");
                return;
            }
           document.getElementById("access key").innerHTML;
        }
</script>
<script type="text/javascript">
    function update() {
        var device_id = document.getElementById("device_id").value;
        if (input.length < 24) {
            alert("please enter a valit input");
            return;
        }
        document.getElementById("device_id").innerHTML;
    }
    </script>
<p><input type="text" id="key" autofocus placeholder = "Enter product key here" /></p>
<p><input type="text" id="device_id" autofocus placeholder = "Enter device ID here" /></p>
<p><input type="submit" value="Submit" onclick="update()"/></p>

   <h1>Rotary Gate Systems</h1>

    <article>
        <a href="#" class="button open_button">Open</a>
    </article>
    <article>
        <a href="#" class="button close_button">Close</a>
    </article>
    <article>
        <p class="status_closed status_button">CLOSED</p>
        <p class="status_open status_button">OPEN</p>
        <p class="status_none status_button">NO CONNECTION</p>
    </article>

    <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.js'></script>
    <script>/*jslint browser: true*/
/*global $, jQuery*/
/*jshint strict: true */
/*EDIT THESE VARIABLES*/
//key is the same as your 'access token'
var key = "key"
//device_id is the same as the 'core id'
var device_id = "device_id"

我想我可能在提交按钮中缺少某些内容，或者我尝试使用此属性可能无法执行的操作。 有人可以看看这个，让我知道我可能在哪里搞砸了？

您需要将条件语句更改为，

if (key.length < 40) {

和

if (device_id.length < 40) {

因为input不是在update()函数中定义的。

此外，您应该考虑将两个update()功能合并为一个，以便在提交表单时对key和device_id一起进行有效性检查。

根据您的评论，听起来您正在尝试使用两个<input>元素的值更新key和device_id变量。

你应该了解 JavaScript 中的变量作用域，以确保你可以访问这些变量。

如果函数运行时key和device_id变量在作用域中，则可以直接为它们赋值。不要在赋值前面加上 var 关键字，否则您将定义新的本地范围的变量，而不是从外部作用域更新现有变量。

您也不能在同一作用域内定义两个同名（在本例中为 update）的函数;只有最近定义的函数才能工作。

var key = "key";
var device_id = "device_id";
function update() {
  var tempkey = document.getElementById("key").value;
  if (tempkey.length < 40) {
    alert("Please enter a valid key.");
    return;
  }else{
    key = tempkey;
  }
  tempdevice_id = document.getElementById("device_id ").value;
  if (tempdevice_id.length < 24) {
    alert("please enter a valid device ID.");
    return;
  }else{
    device_id = tempdevice_id;
  }
}
<p>
  <input type="text" id="key" autofocus placeholder="Enter product key here" />
</p>
<p>
  <input type="text" id="device_id" autofocus placeholder="Enter device ID here" />
</p>
<p>
  <input type="submit" value="Submit" onclick="update()" />
</p>
<h1>Rotary Gate Systems</h1>
<article>
  <a href="#" class="button open_button">Open</a>
</article>
<article>
  <a href="#" class="button close_button">Close</a>
</article>
<article>
  <p class="status_closed status_button">CLOSED</p>
  <p class="status_open status_button">OPEN</p>
  <p class="status_none status_button">NO CONNECTION</p>
</article>

相关文章：