0

Enter キーを押しても、div のフォーカスを変更できません。誰でも助けることができますか？

<div contenteditable="true" id="t" tabindex="-1">
            <div class="me" spellcheck="true" content="inhert" >Hello <span style="font-weight: normal;">world2!</span></div>
            <div class="me" spellcheck="true" content="inhert" >Hello <span style="font-weight: normal;">world3!</span></div>
            <div class="me" spellcheck="true" content="inhert" id="last">Hello <span style="font-weight: normal;">world4!</span></div>
</div>

$("div").bind("keypress", function(event){
                if(event.keyCode == 13){                            
                    event.preventDefault();
                    $("#last").focus();
                }
            });
4

3 に答える 3

1

デフォルトでは、フォーカスは div では機能しません。

focus イベントは、要素がフォーカスを取得したときに送信されます。このイベントは、フォーム要素 (、など) やリンク () など、限られた一連の要素に暗黙的に適用されます。最近のブラウザ バージョンでは、要素の tabindex プロパティを明示的に設定することで、イベントを拡張してすべての要素タイプを含めることができます。要素は、Tab キーなどのキーボード コマンドを使用するか、要素をマウスでクリックすることによって、フォーカスを得ることができます。

読んだ

于 2013-03-15T05:06:51.487 に答える
1

これを試して：

HTML:

<div contenteditable="true" id="t" tabindex="-1">
    <div class="me" spellcheck="true" content="inhert" >Hello 
        <span style="font-weight: normal;">world2!</span></div>
    <div class="me" spellcheck="true" content="inhert" >Hello 
        <span style="font-weight: normal;">world3!</span></div>       
</div>
<div contenteditable="true" class="me" spellcheck="true" content="inhert" id="last">Hello 
    <span style="font-weight: normal;">world4!</span></div>

を作るlast div contenteditable="true"と、それoutsideはmain div

脚本：

$("div").bind("keypress", function(event){
    if(event.keyCode == 13){    
        //alert('ya');
        event.preventDefault();
        $("#last").focus();

    }
});

フィドル: http://jsfiddle.net/Q4J87/

次のように使用できます

$("#last").prop('contenteditable',true).focus();
// alternative if contenteditable not set for last div

フィドル: http://jsfiddle.net/Q4J87/1/

于 2013-03-15T05:05:03.687 に答える
0

次のコードが機能するはずです。

<html>
        <head>
                <title>Test Website</title>
                <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
                <script>
                        $(document).ready(function() {
                                                $("div#last").focus();
                        });
                </script>
        </head>
<body>

        <div contenteditable="true" id="t" tabindex="1">
                    <div class="me" spellcheck="true" content="inhert" >Hello <span style="font-weight: normal;">world2!</span></div>
                    <div class="me" spellcheck="true" content="inhert" >Hello <span style="font-weight: normal;">world3!</span></div>
                    <div class="me" spellcheck="true" content="inhert" tabindex="2" id="last">Hello <span style="font-weight: normal;">world4!</span></div>
        </div>


</body>

</body>
</html>
于 2013-03-15T05:21:47.977 に答える