Jquery的隐藏输入

JS后的元件/ Jquery的焦点下一个元件上消失/焦点元件上的jquery隐藏前一个元素之后出现了一个输入Jquery的隐藏输入

我的代码：

<script> 
$(document).ready(function(){ 
$("div").click(function(){ 
$("#hide").hide(); 
}); 
); 
</script>

上面隐藏元素'div'onclick。我真正想要的是当我填满了第一个领域，然后点击第二个领域，那么它应该隐藏第一个领域。 div应该滑出。例如，我有5个字段名称，电子邮件，出生日期，地址，邮政编码。因此，当我输入我的姓名并点击电子邮件时，姓名DIV应该通过滑出消失。我是JQuery的新手。

我该怎么做？

感谢

来源

2015-02-06 Newbie

可以隐藏在模糊的领域，但是从一个UX点这是非常糟糕的。如果你犯了一个错误，你如何回到你刚填补的领域去改变它？ – Capsule 2015-02-06 00:24:48

虽然它不是隐藏字段是个好主意用户，当focus设置在另一个字段上时，您可以将每个非空字段设置为fadeOut。这样，您至少有可能在单击表单外部时返回字段（直到没有单击其他字段时才会显示）。

$(".txt").focus(function(){ 
 
    var inputs = $(".txt").not($(this)).not(".txt:hidden"); 
 
    if($(".txt").not(".txt:hidden").length == 2){ 
 
    $(".txt").focusout(function(){ 
 
     if($(this).val()){ 
 
     $(this).fadeOut();  
 
     } 
 
    }); 
 
    } 
 
    inputs.each(function(){ 
 
    if($(this).val()){ 
 
     $(this).fadeOut(); 
 
    } 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> 
 

 
<div><input type="text" class="txt" placeholder="Name"/></div> 
 
<div><input type="text" class="txt" placeholder="Email"/></div> 
 
<div><input type="text" class="txt" placeholder="DOB"/></div> 
 
<div><input type="text" class="txt" placeholder="Address"/></div> 
 
<div><input type="text" class="txt" placeholder="Post Code"/></div>

JSFiddle

来源

2015-02-07 00:25:45

可以绑定使用jQuery的on()或bind()方法的事件。您关心的事件是blur，当元素失去焦点时会触发该事件。

喜欢的东西：

$('#name').on('blur', function() { 
    $(this).hide(); 
});

来源

2015-02-06 00:27:34 godswearhats

这是一个非常简单的答案，你可以轻松地扩展：

$('input#email').click(function(){ 
 
    if ($('input#name').val().length > 0){ 
 
     $('input#name').hide(); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input id='name' placeholder="name"></input><br> 
 
<input id='email' placeholder="email"></input><br>

来源

2015-02-06 00:27:54 taesu

Jquery的隐藏输入

回答

相关问题