Jquery实现回车键Enter切换焦点(2)_建站学-个人建站指南,网页制作,网站设计,网站制作教程

$(":input:text:eq(" + nxtIdx + ")").focus();

定位焦点到集合的下一个元素

3.、HTML代码

<div>
        <asp:TextBox ID="txt1" runat="server" /><br />
        <asp:TextBox ID="txt2" runat="server" /><br />
        <asp:TextBox ID="txt3" runat="server" /><br />
        <asp:TextBox ID="txt4" runat="server" /><br />
    </div>

分析：页面上存放四个文本框

3、运行程序

那页面中如果有TextArea 元素，我们如何使用Enter切换焦点呢，办法是有的，如下充分运用了Jquery的一些特性。

4、HTML代码

<div>
        <asp:TextBox ID="tb1" runat="server" class="cls" /><br />
        <asp:TextBox ID="tb2" runat="server" class="cls" /><br />
        <asp:TextBox ID="tb3" TextMode="MultiLine" runat="server" class="cls" /><br />
        <asp:TextBox ID="tb4" runat="server" class="cls" /><br />
    </div>
分析：

页面中所以的TextBox 引用Class=”cls”，便于后期的对页面元素的Jquery查询。

5、Javascript代码

<script type="text/javascript">
        $(function () {
            $('input:text:first').focus();
            var $inp = $('.cls');
            $inp.bind('keydown', function (e) {
                var key = e.which;
                if (key == 13) {
                    e.preventDefault();
                    var nxtIdx = $inp.index(this) + 1;
                    $(".cls:eq(" + nxtIdx + ")").focus(); (责任编辑：admin)

搜索

热门标签:

Jquery实现回车键Enter切换焦点(2)