当用户开始输入输入时更改css

Question

我正在建立一个网站，我希望一旦用户开始输入第一个输入，div就会从display: none;转到display: block;。

我对jquery有所了解，但我不知道如何做到这一点。

任何人都可以帮助我吗？

Answer 1

我会使用keyup或keydown事件：

$('input').on('keyup', function() {
    if ( !$('div').is(':visible') ) $('div').show();
});

FIDDLE

Answer 2

$('#input').keyup(function(){
    $('your_div').css('display','block');
});

Answer 3

您可以使用keydown事件（change只会在input失去焦点时触发：

var to_show = $('#your_div');

$('input').keydown(function() {  
    if(!to_show.is(':visible'))
    {
        to_show.show();
    }
});

Answer 4

根据此答案：https://stackoverflow.com/a/2826423/686036，您需要使用HTML 5的{​​{1}}语法。这将负责自动填充或右键单击粘贴功能。

您输入的内容如下：

oninput

JavaScript：

<input id="myInput" type="text" />

如果需要，可以使用JQuery：

var myInput = document.getElementById("myInput");
myInput.addEventListener('input', myFunction(), true);

既然$('#myInput').bind('input', function() { alert('User clicked on "foo."'); }); 是 W3C候选推荐，它应该/将在大多数新版本的浏览器中实现，如果尚未实现的话。

Answer 5

您可以将更改事件与jquery一起使用：

    $('input').change(function() {
        $('#your-div').show();
    });