根据条件隐藏的Javascript可见性

我想基于文本框中的文本长度来显示和隐藏文本。我已经尝试了下面的代码。但它不工作。帮帮我。根据条件隐藏的Javascript可见性

<!DOCTYPE html> 
<html> 
<head> 
    <script> 
     function myFunction() 
     { 
      var x=document.getElementById("fname"); 
      if(x.length<1) 
       document.getElementById("lname").style.visibility = 'visible'; 
      else 
       document.getElementById("lname").style.visibility = 'hidden'; 

     } 
    </script> 
</head> 
<body> 

    Enter your name: <input type="text" id="fname" onchange="myFunction()"> 

    <div id="lname" style="visibility:hidden">hey im printing</div> 

</body> 
</html>

来源

2014-03-14 Sakthi

你没有检查长度，而是要检查的FNAME元素是否确实存在于当前的DOM与否。 –

我想你是检查元素数量，而不是值的长度与'if（x.length <1）' – Justinas

感谢您的建议！ – Sakthi

你应该检查输入值长度：

var x=document.getElementById("fname"); 
if(x.value.length<1)

来源

2014-03-14 07:44:54 kamilkp

使用此

var x=document.getElementById("fname").value;

而分配值var x。

来源

2014-03-14 07:46:00 Arjit

你的div标签永远不会出现在屏幕上，因为当你没有在文本框中输入任何内容时，它的onchange（）方法将不会被调用，这意味着你的代码在myFunction（）方法不会执行。只有当你在文本框中输入时，它才会进入myFunction（）方法。 – Arjit

试试这个

function myFunction() 
{ 
    var x=document.getElementById("fname").value; 
    if(x.length>=1) 
    { 
     document.getElementById("lname").style.visibility="visible"; 
    } 
    else 
    document.getElementById("lname").style.visibility = 'hidden'; 
}

DEMO

来源

2014-03-14 07:47:09 Amit

试试这个。

<input type="text" id="fname" onkeyup="myFunction()"> 
<div id="lname" style="visibility:hidden">hey im printing</div> 

function myFunction() 
{ 

     var x=document.getElementById("fname"); 
     if(x.value.length>0){ 
      document.getElementById("lname").style.visibility = 'visible'; 
     }else{ 
      document.getElementById("lname").style.visibility = 'hidden'; 
     } 

}

Working DEMO

来源

2014-03-14 07:50:57 anand4tech

检查了这一点使用jquery

<!DOCTYPE html> 
<html> 
<head> 
    <script src="http://code.jquery.com/jquery-latest.min.js" 
     type="text/javascript"></script> 

<script> 
function myFunction() 
{ 

// var x=document.getElementById("fname").val(); 
var x=$("#fname").val(); 
    alert(x.length) 
if(x.length < 1) { 
    alert('if'); 
     $("#lname").css("display", "block"); 
} 
//document.getElementById("lname").style.visibility = 'visible'; 
else { 
    $("#lname").css("display", "none"); 
} 

} 
</script> 
</head> 
<body> 

Enter your name: <input type="text" id="fname" onchange="myFunction()"> 

<div id="lname" style="display:none">hey im printing</div> 

</body> 
</html>

来源

2014-03-14 07:51:46

根据条件隐藏的Javascript可见性

回答

相关问题