0

これが私のhtmlコードです

<ul class="options-list">
    <li contenteditable="true">Customer List</li>
    <li contenteditable="true">Product List</li>
</ul>

ユーザーが最初の li をクリックすると、コンテンツが編集可能になり、2 番目の div でも同じことが起こります。ここでの要件は、最初の li で編集中にユーザーが Enter キーを押した場合、最初の li の編集を停止して 2 番目の li に移動し、編集モードを自動的に開始する必要があることです。

これが私のJSコードです

$('.options-list').on('keypress', 'li', function (e) {
    if (e.keyCode === 13) {
        $(e.currentTarget).blur(); //this works
        $(e.currentTarget).siblings('li').click(); // this doesn't work
        return false;
    }
})

どんな助けでもいただければ幸いです

4

3 に答える 3

1

の代わりに.click()、 を使用できます.focus()。

例えば：

$('.options-list').on('keypress', 'li', function (e) {
    if (e.keyCode === 13) {
        $(e.currentTarget).blur(); 
        $(e.currentTarget).siblings('li').focus(); 
        return false;
    }
})

jsfiddle のデモはこちらです。

于 2013-10-26T14:45:04.243 に答える
1

$(e.currentTarget).siblings('li').click();に変更$(e.currentTarget).next('li').focus();

于 2013-10-26T14:45:42.283 に答える
0

使用する代わりに.siblings('li').click();

あなたが使用することができます.next('li').focus();

これは、フォーカスを次の li 要素に移動するのに役立ちます。

また.siblings('li')、リストの最後のli要素に移動します。

ただし.next()、フォーカスを次の li 要素に連続して移動します。

このjsfiddleデモの例を試してください

ありがとう。

于 2013-10-26T15:38:53.620 に答える