使用Enter键到下一个div,而不是输入?

时间:2014-07-16 11:09:10

标签: javascript jquery html css

有一个时髦的我无法解决。我正在使用满足于从客户那里获取信息的Div,Tabbing通过工作正常,但如果我只需按Enter键选项卡到下一个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>

1 个答案:

答案 0 :(得分:4)

你可以看一下:

<强> DEMO

因此,您需要输入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();
        }
    }
});

<强> DEMO