html 输入标签在 Javascript 中总是读取 null

html input tag always reads null in Javascript

本文关键字:读取 null Javascript 输入 标签 html      更新时间:2023-09-26

我正在尝试一个简单的登录页面。我添加了一些文本字段,并希望使用javascript或jquery读取它们。我遇到的问题是,每次使用 javascript 时我都会收到一个空错误,使用 jquery 时都会收到一个空白错误,即使我在字段中输入文本也是如此。

.html:

<label id='userNameLabel' class='inputLabel' for='userNameInput'>Username</label>
<input id='userNameInput' name='User' class='userInput' type='text' value=''>
<label id='passwordLabel' class='inputLabel' for='passwordInput'>Password</label>
<input id='passwordInput' name='Password' class='userInput' type='text' value=''>
<input id='submitSignIn' class='button' type='submit' value='Log In'>

.js:

$(document).ready(function(){
 $('#submitSignIn').click(function(){
  $userName = $('#userNameInput').text();
  $userName = $('#passwordInput').text();
  $rememberMe = $('#rememberMe').val();
 });
})

-或

$(document).ready(function(){
 $('#submitSignIn').click(function(){
  $userName = document.getElementById(userNameInput).value;
  $userName = document.getElementById(passwordInput).value;
  $rememberMe = document.getElementById(rememberMe).value;
 });
})

谁能告诉我为什么我会遇到这个问题?

$userName = $('#userNameInput').text();

这将尝试获取输入的子节点并从中提取文本。

输入元素不能有任何子节点。你想要val().

$userName = document.getElementById(userNameInput).value;

这试图通过字符串变量 userNameInput 中的 id 获取元素,这是未声明的。您需要在它周围加上引号以使其成为字符串文字。

你的jQuery使用的是.text()而不是.val() - 输入是自闭合元素,因此没有任何文本。

你的 JavaScript 在 userNameInput 周围缺少引号,这意味着它正在获取变量userNameInput而不是字符串"userNameInput"

用于检查总线使用是检查方法

   $(document).ready(function(){
     $('#submitSignIn').click(function(){
      $userName = $('#userNameInput').val();
      $userPass = $('#passwordInput').val();
     })

;