Question

如何在填充文本框时使用JavaScript隐藏div类？

我希望在文本框（t1）填充时隐藏课程 loadData 。

示例代码：

<input type="text" name="t1" placeholder="search">


<div class="loadData">
     // some content here....
</div>

Answer 1

    window.onload = function () {
    elements = document.getElementsByName("t1"); 
    var divs = document.getElementsByClassName("loadData");
    elements.onblur = function() { divs.style.visibility="hidden"; };
    };

Answer 2

使用 jQuery 。检查keyup事件上的文本字段的值，并相应地执行操作。

$('input[type="text"]').on('keyup', function() {
    ($.trim($(this).val()) != '') ? $('.loadData').hide() : $('.loadData').show();
})

FIDDLE

Answer 3

用户jQuery's模糊功能。

<script>
$(function(){
  $("[name=t1]").blur(function(){
    if ($(this).val() == '') {
      $(".loadData").hide();
    }
  });
})
</script>

<强>解释

您正在blur文本框事件中调用函数。

这意味着用户已填写文本框并希望离开文本框。

在此函数体中，使用类loadData隐藏div。

Answer 4

将onblur="showdiv()"添加到输入框并在您的javascript中添加此功能

function showdiv()    
{    
    var a=document.getElementsByClassName('loadData');
    a[0].style.visibility='hidden';    
}

如何在填充文本框时隐藏div类

4 个答案: