Question

Code:

$(document).ready(function(){
$(".div").hide();
$(document).on('keypress paste', function() {
    $('form').focus();
    $(".div").show("fast");
});
});

Thanks to adeneo for the cleaner code.

Description of use:

The div element contains a hidden search form. When a key is pressed or the paste (ctrl+v) function is used on the page, a search box appears with the data inside.

Problem:

The first keypress works, but the first letter that is used as the keypress to unhide the div is lost in translation. So ‘hello’ becomes ‘ello’ in the search box.

The second works also, as long as you press ctrl+v twice. As above, it is using the first instance to call the div (I assume?).

Help:

Looking for any way to fix this code so it works as explained, or pointing in the right direction as to what code I should be using if the current code won’t work.

Answer 1

This should work for the keypress-problem.

$(document).ready(function(){
$(".div").hide();                     
$(document).keypress(function (e) {
    if($('.div').is(':hidden')){
        $(".div").show("fast");
        $("#query").val($("#query").val()+String.fromCharCode(e.charCode));
        document.forms['form'].elements['query'].focus();
    }
});

$(document).bind('paste', function(e){
    console.log(e);
    document.forms['form'].elements['query'].focus();
    $(".div").show("fast");

});
});

http://jsfiddle.net/Jkcj6/2/