2015-08-15 81 views
-1

如何隐藏标签,如果事情是在输入值

#Start+ #DITBT { 
 
    position: absolute; 
 
    top:5px; 
 
    right:1160px; 
 
    left: 15px;-webkit-transform: translate3d(0px, 0px, 0px); 
 
    opacity: 0.5; 
 
    transition: opacity .25s ease-in-out; 
 
    -webkit-transition: opacity .25s ease-in-out; } 
 
#Start:focus + #DITBT { 
 
opacity:0; 
 
}
<div class="input-field"> 
 
    <input type="text" name="firstname" id="Start" maxlength="30" class="pad" required /> 
 
    <label for="Start" id="DITBT">First name</label> 
 
</div>

如何隐藏标签,如果事情是在输入值

+0

添加你的HTML代码片段请。 –

+0

Murad

+0

你想隐藏自己的标签? –

回答

-1
$('input').on('input',function(){ 
    if($(this).val() != '') { 
     $(this).parent().find('label').fadeOut(); 
    } else { 
     $(this).parent().find('label').fadeIn(); 
    } 
}); 

http://jsfiddle.net/nwdrrnun/2/

+0

首选使用HTML属性,除非您没有任何其他选项,因为Java脚本会减慢页面加载时间。你的Java Script代码中的7行,可能是HTML中的1行! –

+0

他问隐藏LABEL,而不是占位符,你不能占位符样式... –

+0

在编程中没有什么叫做“你不能”。当然,您可以设计一个占位符,请阅读: http://davidwalsh.name/html5-placeholder-css http://blog.teamtreehouse.com/the-css3-placeholder-pseudo-element –