Tabindex基于输入键,通过获取在Jquery中不起作用的表单元素

时间:2011-01-08 07:08:30

标签: jquery key tabindex enter

我有一个表单,我可以通过serializeArray()获取所有表单元素。 我希望使用回车键基于tabindex值对表单元素focus()进行$.fn.entertab = function() { var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0; var maxTabIndex = 20; var elements = this.serializeArray(); $.each(elements, function(i, element) { this.keypress(function(e){ var nTabIndex=this.tabIndex; var myNode=this.nodeName.toLowerCase(); if(nTabIndex > 0 && key == 13 && nTabIndex <= maxTabIndex && ((!myNode.attr("disabled")) || (myNode.val == ""))) { myNode.focus(); } else { nTabIndex=this.tabIndex+1; myNode.focus(); } }); }); } $("theform").entertab(); 。只有它有价值或者专注于自身。

jQuery的新手,如果有任何错误......

{{1}}

2 个答案:

答案 0 :(得分:1)

您也可以试试这个 HTML

<input id="122" class='TabOnEnter' tabindex="1" /><br>
<input id="123" class='TabOnEnter' tabindex="2" /><br>
<input id="124" class='TabOnEnter' tabindex="4" />This input is hidden<br>
<input id="124" class='TabOnEnter' tabindex="5" /><br>
<input id="125" class='TabOnEnter' tabindex="3" /><br>
<textarea class='TabOnEnter' tabindex="6">Hi, I am a test area</textarea>

SCRIPT ///////////

$(document).on("keypress", ".TabOnEnter" , function(e)
  {
    //Only do something when the user presses enter
    if( e.keyCode ==  13 )
    {
       var nextElement = $('[tabindex="' + (this.tabIndex+1)  + '"]');
       console.log( this , nextElement ); 
       if(nextElement.length )
         nextElement.focus()
       else
         $('[tabindex="1"]').focus();  
    }   
  });

//Hidden inputs should get their tabindex fixed, not in scope ;)
//$(function(){ $('input[tabindex="4"]').fadeOut();  })

////////////// 在EI,Chrome,Mozilla中工作得很好。没有在safari和其他浏览器中测试

答案 1 :(得分:0)

我想我明白你想做什么。我重写了你的代码并最终得到了这个:

(function($){

    $.fn.entertab = function(options) {

        var defaults = {
            maxTabIndex: 20
        };

        options = $.extend({}, defaults, options);

        return this.filter('form').each(function(){

            var $this = $(this),
                $elms = $this.find("[tabindex]");

            $elms.each(function(){
                var $elm = $(this),
                    idx = parseInt($elm.attr("tabindex"));
                if (idx > options.maxTabIndex) {
                    return;
                }
                $elm.keydown(function(e){
                    if (e.which == 13 && ($elm.val() != '')) {
                        $elms.filter("[tabindex="+(idx+1)+"]").focus();
                        e.preventDefault();
                    }
                });
            });
        });
    };

})(jQuery);

jsFiddle上有一个有效的例子。