2016-03-08 45 views
0

我试图编写这个网络应用程序,让用户输入有关他们的设备的重要信息,然后将其放置在JavaScript中的相关位置。这是我的代码到目前为止。使用ID获取用户输入元素

<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" 

我想我可能会错过提交按钮中的某些东西,或者我想要做的事可能无法使用此属性。有人可以看看这个,让我知道我可能会搞砸吗?

+0

什么你期望'的document.getElementById( “快捷键”)的innerHTML做;'怎么办? – Thriggle

+0

我的理论是改变代码底部的“var key”和“var device_id”。 –

回答

1

你需要改变你的条件语句,

if (key.length < 40) { 

if (device_id.length < 40) { 

因为input没有内部的update()功能定义。

此外,您应该考虑将两个update()函数合并为一个函数,以便在提交表单时一起对keydevice_id进行有效性检查。

+0

我会进行这些更改,感谢您的输入。你看到提交按钮有什么问题吗?我不确定它是否正确,这是我第一次使用这种方法编辑javascript。 –

0

根据你的意见,这听起来像你试图用两个<input>元素的值更新keydevice_id变量。

您应该了解JavaScript中的变量范围,以确保您可以访问这些变量。

如果keydevice_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>