Question

假设我有这个简单的HTML：

<input type="text" id="inputId" /><img id="imgId" src="images/myImage.gif" style="display:none" />

现在我想这样做：

1）当有人在输入中写入时我想要显示图像 1）当用户停止在输入中写入或输入为空时1-2秒我想隐藏图像

我知道如何显示或隐藏图像：

$('#imgId').css('display', '')

或

$('#imgId').css('display', 'none')

但我不知道如何添加时间。

由于

Answer 1

像那样的东西

var initial;

function invocation() {
    initial = window.setTimeout( 
    function() {
        $("#imgId").hide();
    }, 2000);
}



$('#inputId').keypress(function() {

    $("#imgId").hide();
    clearTimeout( initial );
    invocation();
});

请参阅jsFiddle

Answer 2

您可以使用window.setTimeout（myfunction，delay）并在每次输入更改时重新启动超时。因此，在没有输入2秒后，myfunction将执行。如果你想帮助写它，请评论。

jquery还有hide（）和show（）函数，而不是手动更改css。

Answer 3

使用keydown（），keyup（）事件

$( "#inputAreaID" ).keydown(function(){
    $('#imgId').css('display', 'block')
});

$( "#inputAreaID" ).keyup(function(){
    $('#imgId').css('display', 'none')
});

Jquery / Javascript：根据用户输入时间做一些事情？

3 个答案: