我正在尝试使用 javascript 调用文本输入答案

【问题标题】：I am trying to call on a text input with javascript我正在尝试使用 javascript 调用文本输入
【发布时间】：2017-03-30 08:39:03
【问题描述】：

我正在尝试检查以确保表单完整，这是我的一段代码检查密码

function checkpass()
{
   
    var pass1 = document.getElementById('pass1');
    var pass2 = document.getElementById('pass2');
   
    var message = document.getElementById('confirmMessage');
  
    var goodColor = "#66cc66";
    var badColor = "#ff6666";
  
    if(pass1.value == pass2.value){
        
        pass2.style.backgroundColor = goodColor;
        message.style.color = goodColor;
        message.innerHTML = "Passwords Match!"
    }else{
        
        pass2.style.backgroundColor = badColor;
        message.style.color = badColor;
        message.innerHTML = "Passwords Do Not Match!"
    }
}

<label >Password:</label>
            <input type="password" name="pass1" id="pass1">
      <p></p>
      
        <label >Verify Password:</label>
        <input type="password" name="pass2" id="pass2" onBlur="checkpass()">
<span id="confirmMessage" class="confirmMessage"></span>

这可行，但是当我尝试使用名称输入做类似的事情时，它不起作用

 <input type="text" name="name1" id="name1" onblur="checkname">
 <label>First Name</label> 
function checkname(){var name1 = document.getElementById('name1');if (name1 == null) {alert('entername');}}

如果你能告诉我我犯的一个简单的错误，让我看起来像个白痴，那就太好了，或者如果你能告诉我一个更好的方法来完成整个事情，那也很棒。您可以提供的任何帮助将不胜感激。

【问题讨论】：

标签： javascript html validation input

【解决方案1】：

var name1 = document.getElementById('name1')

你忘记了最后的 .value

var name1 = document.getElementById('name1').value

【讨论】：

谢谢@halonico

【解决方案2】：

您需要检查空名称而不是空名称尝试使用：

var name1 = document.getElementById('name1').value;
if(name1.trim() == "")

您还需要在 onblur 上调用 checkname() 函数来代替 checkname

function checkname(){
var name1 = document.getElementById('name1').value;
if (name1.trim() == "")
{
alert('entername');
}
}
function checkpass()
{
   
    var pass1 = document.getElementById('pass1');
    var pass2 = document.getElementById('pass2');
   
    var message = document.getElementById('confirmMessage');
  
    var goodColor = "#66cc66";
    var badColor = "#ff6666";
  
    if(pass1.value == pass2.value){
        
        pass2.style.backgroundColor = goodColor;
        message.style.color = goodColor;
        message.innerHTML = "Passwords Match!"
    }else{
        
        pass2.style.backgroundColor = badColor;
        message.style.color = badColor;
        message.innerHTML = "Passwords Do Not Match!"
    }
}

 
<label >Password:</label>
            <input type="password" name="pass1" id="pass1">
<br/>
      
        <label >Verify Password:</label>
        <input type="password" name="pass2" id="pass2" onBlur="checkpass()">
        <br/>
<span id="confirmMessage" class="confirmMessage"></span>
<br/>

 <input type="text" name="name1" id="name1" onblur="checkname();">
 <label>First Name</label> 
 <br/>
 <input type="text" name="name2" id="name2">
 <label>Last Name</label>

【讨论】：

谢谢?@Shakti Phartiyal

【解决方案3】：

就这样试试

<input type="text" name="name1" id="name1" onblur="checkname">
<label>First Name</label> 

function checkname()
{
     var name1 = document.getElementById('name1').value;
     if (name1 == null || name1 == "") 
     {   
        alert('entername');
     }
}

您在使用 id 选择属性时错过了值

【讨论】：

【解决方案4】：

你写错了

onblur="checkname"

应该是这样的

onblur="checkname()"

function checkname(){
  var name1 = document.getElementById('name1');
 
    console.log('name1');
  }

<input type="text" name="name1" id="name1" onblur="checkname()">
 <label>First Name</label>

【讨论】：

谢谢@Dhiraj
它有效，谢谢，我错过的（）只是在我的问题中，而不是我的原始代码对此感到抱歉。我的问题是使用 null 并遗漏了一个值标签。我尝试了您的代码并且它有效，但是当我添加一个 if 语句时它停止了。如果可以的话，我能得到一些帮助吗？ function checkname(){ var name1 = document.getElementById('name1') if (name1.value = ""){ alert('blank');} }else {alert(name1)}