入力時に.focus（）の問題が発生しました

Question

ここでは、私は良いと思ったカーソルが好きな入力があります。私は、カーソルが動作するようにjqueryを使用しますが、.focus（）関数を動作させることはできません

https://jsfiddle.net/cityFoeS/z9Ldt/233/

これは私のjQueryのです：

$(function() { 



var cursor; 

$('#cmd').click(function() { 
    $('input').focus(); 

    cursor = window.setInterval(function() { 
    if ($('#cursor').css('visibility') === 'visible') { 
    $('#cursor').css({ visibility: 'hidden' }); 
    } else { 
    $('#cursor').css({ visibility: 'visible' }); 
    } 
    }, 500); 

}); 

$('input').keyup(function() { 
    $('#cmd span').text($(this).val()); 

}); 

    $('input').blur(function() { 
    clearInterval(cursor); 
    $('#cursor').css({ visibility: 'visible' });  
    }); 


}); 
$('#text').focus(); 

Answer 1

$(function(){ });は、文書が解析され、準備ができているとき、それは発射$(document).ready(function() { })

と同じです。

あなたはこのスニペットの外側に$('#text').focus();があり、そのコードはdocument.readyより前に実行されています。 onclick関数とonblur関数はまだ設定されていませんでした。

これを試すことができます。あなたのJSを変更し、機能を取り付けた後、「CMD」のdivのクリック操作をシミュレートする場合は、それが動作：

$(function() { 

var cursor; 

$('#cmd').click(function() { 
    $('input').focus(); 

    cursor = window.setInterval(function() { 
    if ($('#cursor').css('visibility') === 'visible') { 
    $('#cursor').css({ visibility: 'hidden' }); 
    } else { 
    $('#cursor').css({ visibility: 'visible' }); 
    } 
    }, 500); 

}); 

$('#cmd').click(); 

$('input').keyup(function() { 
    $('#cmd span').text($(this).val()); 

}); 

    $('input').blur(function() { 
    clearInterval(cursor); 
    $('#cursor').css({ visibility: 'visible' });  
    }); 


});