使用Enter来选择下一个div,而不是输入



有个我解决不了的问题。我使用的div是可满足的从客户接收信息,通过tab通过工作很好,但它会更快,如果我可以简单地按Enter tab到下一个div,我不知道如何实现这一点。

我在这里创建了这个提琴:http://jsfiddle.net/zkDfm/

 <div class="card shadow rounded">
<div class="card-content one-third">
    <div class="list-title">Owner Details</div>
    <ul class="detail-list">
        <li class="button rounded"><a class="list-heading">Mr:</a> <a class="list-result-edit" contenteditable="true"></a></li>
        <li class="button rounded"><a class="list-heading">Mrs:</a> <a class="list-result-edit" contenteditable="true"></a></li>
        <li class="button rounded"><a class="list-heading">Email:</a> <a class="list-result-edit" contenteditable="true"></a></li>
        <li class="button rounded"><a class="list-heading">Mobile No:</a> <a class="list-result-edit" contenteditable="true"></a></li>
        <li class="button rounded"><a class="list-heading">Phone No:</a> <a class="list-result-edit" contenteditable="true"></a></li>
        <li class="button rounded"><a class="list-heading">Address:</a> <a class="list-result-edit" contenteditable="true"></a></li>
    </ul>
</div>

你可以看这里:

那么,输入keyevent,他会这样:

$(".list-result-edit").keypress(function(e) {
    if(e.which == 13) {
        e.preventDefault();
        $(e.target).parent().next().children().focus();
    }
});

编辑

如果你有多个块,就像你提到的,这只需要多做一点工作。

$(".list-result-edit").keypress(function(e) {
    if(e.which == 13) {
        e.preventDefault();
        if($(e.target).parent().is(":last-child")) {
            $(e.target).parents(".card-content").next().find(".list-result-edit:first").focus();
        }
        else {
            $(e.target).parent().next().children().focus();
        }
    }
});

最新更新