Tabindex基于输入键通过获取表单elemens不工作在jquery

我有一个表单，我能够通过serializeArray()获取所有表单元素。我想要focus()基于它们的tabindex值使用回车键的表单元素。只有在它有价值或者专注于自己的时候。Tabindex基于输入键通过获取表单elemens不工作在jquery

小新的jQuery，所以如果任何错误......

$.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();

来源

2011-01-08 Ullas Prabhakar

您能否提供您正在使用的HTML？直到一些建议：移动var key ...在this.keypress函数中，使用onload/ready状态来启动entertab（）：$（function（）{/ * here code//}）;并且你使用的是“theform”，那不是标签名称，如果它是一个类名，那么使用$（“。theform”）。entertab（）; – 2011-01-08 11:36:30

我想我明白你想要做什么。我改写了你的代码，并结束了与此：

(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工作的例子。

来源

2011-01-08 12:05:30 mekwall

@ullasvk，没问题，但这是否回答你的问题？如果是这样，请接受这个答案。 – mekwall 2011-01-08 18:37:03

你也可以试试这个 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和其他浏览器中测试

来源

2013-07-31 13:04:20

Tabindex基于输入键通过获取表单elemens不工作在jquery

回答

相关问题